1.什么是getComputedStyle?getComputedStyle是一个工具,可以获取当前元素使用的所有最终CSS属性值。返回一个CSS样式声明对象([objectCSSStyleDeclaration]),只读。getComputedStyle()给出一个元素的所有CSS属性最终使用的值。语法如下:varstyle=window.getComputedStyle("element","pseudo-class");例如:vardom=document.getElementById("test"),style=window.getComputedStyle(dom,":after");只有两个参数,中文大家都懂,没什么好说的。额外提醒一下:在Gecko2.0(Firefox4/Thunderbird3.3/SeaMonkey2.1)之前,第二个参数“伪类”是必需的(如果不是伪类,则将其设置为空),但现在,它是不是必需的参数。2.getComputedStyle和style的区别我们也可以使用element.style来获取元素的CSS样式声明对象,但是它和getComputedStyle方法有一些区别。只读可写由于上面提到的getComputedStyle方法是只读的,只能获取样式,不能设置;而element.style可以读写,可以伸缩。获取的对象范围getComputedStyle方法获取最终应用到元素上的所有CSS属性对象(即使没有CSS代码也会显示默认的八代祖先);而element.style只能获取元素的style属性style中的CSS。因此,对于一个裸元素
,getComputedStyle方法返回的对象中的length属性值(如果有的话)为190+(根据我的测试FF:192,IE9:195,Chrome:253,结果可能会有所不同在不同的环境中),并且element.style为0。3.getComputedStyle和defaultView如果我们看一下jQuery的源码,就会发现它的css()方法的实现不是window.getComputedStyle而是document.defaultView.getComputedStyle,对吧?这怎么是一回事?jQuery源码使用document.defaultView.getComputedStyle的截图证明,其实使用defaultView基本没有必要,getComputedStyle本身就存在于window对象中。按照DennisHall的说法,使用defaultView可能是人们不愿意专门在window上写一些东西,其次是为了让API在Java中可用(这个我没看懂,忘记指出了~~).但是有一种特殊情况,在FireFox3.6上不使用defaultView方法是解决不了的,就是访问frame的样式。四、getComputedStyle兼容性对于桌面设备:ChromeFirefox(Gecko)InternetExplorerOperaSafari基本支持supportSupport9SupportSupport伪类元素SupportSupportSupportNoSupportNoSupportSupport对于移动设备:AndroidFirefoxMobile(Gecko)IEMobileOperaMobileSafariMobileBasic支持支持WP7Mango支持支持伪元素支持??没有支持??问号表示没有测试,不知道是否兼容。如果您方便测试,欢迎将测试结果告知我们,我们会及时更新,并附上您的姓名,感谢您的贡献。我们先关注桌面设备,可以看到IE6~8不支持getComputedStyle方法。嗯,背了半天的儿媳妇,发现变的是孙悟空——郁闷。别担心,IE有它自己的一套东西。5、getComputedStyle和currentStylecurrentStyle是IE浏览器的一个属性,自娱自乐。它与element.style可以说是近亲,至少在使用形式上是这样。Element.currentStyle,不同的是element.currentStyle返回的是元素当前应用的最终CSS属性值(包括外部CSS文件、页面内嵌的