首页 > 代码库 > javascript获取行间样式和非行间样式--兼容写法

javascript获取行间样式和非行间样式--兼容写法

 

style:获取行间样式;
currentStyle:获取计算后的样式,也叫当前样式、最终样式。

优点:可以获取元素的最终样式,包括浏览器的默认值,而不像style只能获取行间样式,所以更常用到。
注意:不能获取复合样式如background属性值,只能获取单一样式如background-color等。

alert (oAbc.currentStyle);
IE8和Opera 11弹出了“object CSSStyleDeclaration”;FF 12、chrome 14、safari 5则弹出“undefined”。
 


var oAbc = document.getElementById("abc");
if(oAbc.currentStyle) {
        //IE、Opera
        alert("我支持currentStyle");
} else {
        //FF、chrome、safari
        alert("我不支持currentStyle");
}

其实在FF浏览器中我们可以使用getComputedStyle(obj,false)来达到与IE下currentStyle相同的效果。

getComputedStyle(obj,false):在FF新版本中只需要第一个参数,即操作对象,第二个参数写“false”也是大家通用的写法,目的是为了兼容老版本的火狐浏览器。

兼容写法:


var oAbc = document.getElementById("abc");
if(oAbc.currentStyle) {
        //IE、Opera
        //alert("我支持currentStyle");
        alert(oAbc.currentStyle.width);
} else {
        //FF、chrome、safari
        //alert("我不支持currentStyle");
        alert(getComputedStyle(oAbc,false).width);
}

 

javascript获取行间样式和非行间样式--兼容写法