style 与 getComputedStyle

getComputedStyle 获取所有样式

DOM 中 getComputedStyle 方法可用来获取元素中所有可用的css属性列表，以数组形式返回，并且是只读的。IE678 中则用 currentStyle 代替 。

// 语法：

// 在旧版本之前，第二个参数“伪类”是必需的，现代浏览器已经不是必需参数了

// 如果不是伪类，设置为null，

window.getComputedStyle("元素", "伪类");

getPropertyValue 获取单一样式

window.getComputedStyle 获取的是所有的样式，如果我们只是要获取单一样式，该怎么做呢。这个时候就要介绍另一个方法 -- getPropertyValue 。

// 语法：
// 使用 getPropertyValue 来指定获取的属性
window.getComputedStyle("元素", "伪类").getPropertyValue(style);

与 getComputedStyle 对应，在 IE 中有自己特有的 currentStyle 属性，

与 getPropertyValue 对应，IE 中使用 getAttribute 。

和 getComputedStyle 方法不同的是，currentStyle 要获得属性名的话必须采用驼峰式的写法。也就是如果我需要获取 font-size 属性，那么传入的参数应该是 fontSize。

style 与 getComputedStyle 

首先，element.style 是可读可写的，而 getComputedStyle  为只读。

其次，element.style 只可以获取 style 样式上的属性值，而无法得到所有的 CSS 样式值，什么意思呢？回顾一下 CSS 基础，CSS 样式表的表现有三种方式，

1. 内嵌样式（inline Style） ：是写在 HTML 标签里面的，内嵌样式只对该标签有效。
2. 内部样式（internal Style Sheet）：是写在 HTML 的 <style> 标签里面的，内部样式只对所在的网页有效。
3. 外部样式表（External Style Sheet）：如果很多网页需要用到同样的样式(Styles)，将样式(Styles)写在一个以 .CSS 为后缀的 CSS 文件里，然后在每个需要用到这些样式(Styles)的网页里引用这个 CSS 文件。 

而 element.style 只能获取被这些样式表定义了的样式，而 getComputedStyle 能获取到所有样式的值（在不同浏览器结果不一样，chrome 中是 264，在 Firefox 中是238），不管是否定义在样式表中