getComputedStyle兼容

兼容性

     currentStyle               //IE8及以下支持

     getComputedStyle    //IE8以上、FireFox、Chrome支持

使用方法

     obj.currentStyle[attr];                                   //IE8及以下支持

     window.getComputedStyle(obj,null)[attr];  //IE8以上、FireFox、Chrome支持；参数一：元素；参数二：伪类

JavaScript中访问元素的样式

     javascript中，使用驼峰的形式取CSS属性， 通过style对象取得style特性中指定的样式。

例：document.getElementById("box").style .backgroundColor ;               //读取背景色     读取元素的“内联样式

例：document.getElementById("box").style.backgroundColor = "red";  //设置背景的颜色为红色

float例外，因为float是保留字，不能用作属性名。

    css-----------float

    javascript----(1)cssFloat：FireFox、Safari、Opera和Chrome都支持；

                         (2)IE支持styleFloat。

标准模式下，所有度量值必须制定一个度量单位； 混杂模式下，可以不写单位。

标准模式下不加单位会导致被忽略，所以最好都指定度量单位。

例：document.getElementById("box").style.width = "100px";//设置宽度为100像素

getComputedStyle 和 element.style的不同点

1、element.style  读取的只是元素的“内联样式”； getComputedStyle  读取的样式是 最终样式 ，包括了“内联样式”、“嵌入样式”和“外部样式”。 

2、element.style 可读写，而 getComputedStyle只可读。

通常使用 getComputedStyle 读取样式，通过 element.style 修改样式。