getComputedStyle和Style获取css对象的区别

一、用法

document.defaultView.getComputedStyle(element[,pseudo-element])
或者window.getComputedStyle(element[,pseudo-element]); 
首先是有两个参数，元素和伪类。第二个参数不是必须的，
当不查询伪类元素的时候可以忽略或者传入 null。

二、返回值

getComputedStyle 返回的对象是 CSSStyleDeclaration 类型的对象。
取数据的时候可以直接按照属性的取法去取数据，例如 style.backgroundColor。
需要注意的是，返回的对象的键名是 css 的驼峰式写法，background-color -> backgroundColor。
需要注意的是 float 属性，根据 《JavaScript 高级程序》所描述的情况 ，float 是 JS 的保留关键字。
根据 DOM2 级的规范，取元素的 float 的时候应该使用 cssFloat。其实 chrome 和 Firefox 是支持 float 属性的，也就是说可以直接使用。

三、和 style 的异同

getComputedStyle 和 element.style 的相同点就是二者返回的都是 CSSStyleDeclaration 对象，
取相应属性值得时候都是采用的 CSS 驼峰式写法，均需要注意 float 属性。
而不同点就是：
element.style 读取的只是元素的内联样式，即写在元素的 style 属性上的样式；
而 getComputedStyle 读取的样式是最终样式，包括了内联样式、嵌入样式和外部样式。
element.style 既支持读也支持写，我们通过 element.style 即可改写元素的样式。
而 getComputedStyle 仅支持读并不支持写入。我们可以通过使用 getComputedStyle 读取样式，通过 element.style 修改样式
我们可以通过使用 getComputedStyle 读取样式，通过 element.style 修改样式。

四、兼容性

关于 getComputedStyle 的兼容性问题，在 Chrome 和 Firefox 是支持该属性的，
同时 IE 9 10 11 也是支持相同的特性的，IE 8并不支持这个特性。 
IE 8 支持的是 element.currentStyle 这个属性，
这个属性返回的值和 getComputedStyle 的返回基本一致，
只是在 float 的支持上，IE 8 支持的是 styleFloat,这点需要注意。