获取页面元素的有效式样值 _Web前端

获取页面元素的有效样式值

二是如果一个元素是100像素高，想获取他的当前高度，如果希望从样式属性中就能得到100px这样的精确结果，但是有时候并不能如愿。这是因为在使用样式表或者行内css所预设的样式信息并不能精确可靠的反应到当前的样式属性中。

所以以下方法可以找精确的找到对应的元素值：

写道

function getStyle(elem,name){
if(elem.style[name])
return elem.style[name];
else if(elem.currentStyle)
{
return elem.currentStyle[name];

}
else if(document.defaultView&&document.defaultView.getComputedStyle)
{
name=name.replace(/[A-Z]/g,"-$1");
name=name.toLowerCase();
var s=document.defaultView.getComputedStyle(elem,"");
return s&&s.getPropertyValue(name);

}
else return null;
}

这个方法里头的关键字介绍：

currentStyle

(

?? 表示的是实际的属性：

?? 例如：行内样式是? 100px? 而样式表样式是200是px!important? 那么这个实际属性值就是200px

)

这一特定于 IE 的属性应用于元素的所有 CSS 属性的级联组。它是 Window.getComputedStyle() 的仅用于 IE 的替代。

当你无法确定元素的样式在哪里被定义，或元素同时被内联样式和 CSS 规则定义又不能确定哪一处定义是最优先级的，这时你需要获取其最终呈现的样式：

IE 为每个元素提供的 currentStyle 对象；

FF(other) DOM 则从 document.defaultView 对象中访问 getComputedStyle() 方法；(同样这个也是获取实际样式的值)