JS-检查元素的声明样式属性是否在vh中设置

时间:2019-07-17 11:01:06

标签: javascript flexbox viewport-units

说我们有一个元素

javax.naming.NameNotFoundException
<div class="vh-100">
 Content
</div>

由于

,我该如何读取确切的值.vh-100 { height: 100vh }
100vh

简而言之,我需要找到一种方法来确定是否在var computedHeight = window.getComputedStyle(element).height; // will simply return the `window.clientHeight` value in pixels in this case. var styleAttributeHeight = element.style.height // will return '', which is empty 中设置了该值,因为示例vh的子元素的框模型已损坏,并且返回了错误的{{1 }}和<div class="vh-100">

除了检查CSS文件中的offsetTop,我需要一个简单的解决方案。

这里是link,希望可以解释为什么我需要这个。

2 个答案:

答案 0 :(得分:0)

直接没有办法,但是我将像素转换为vh(1vh是1/100浏览器高度)。这是代码段,希望对您有所帮助。

/*var z = getComputedStyle(document.getElementsByClassName('deneme')[0],null).height.replace('px','');*/
/*var b = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);*/

//deactive variables for detailed usings.

var a = document.getElementsByClassName('sample')[0].clientHeight;
var b = window.innerHeight;
var c = Math.round((a / b) * 100) + "vh";
console.log(a)
console.log(b)
console.log(c)//it's your "vh"
.sample{
	width: 10vw;
	height: 1vh;
	background:dodgerblue;
}
<div class="sample"></div>

答案 1 :(得分:-1)

如果您想要的是高度单位

yourElement.style.height

通常,它将以您为该元素确定的单位返回一个高度字符串(以您的情况为'100vh')。