js获取行间和非行间样式

在js中我们经常要获取css样式，然后我们经常是这样写的

比如我们现在有一个div，id为div1，我们可能会这样获取

document.getElementById("div1").style.width;

ok,也许有的时候真的没有问题，因为你的div是这样的

<div id="div1" style="width:100px"></div>

那上面的代码可以完美地获取到width为100px,

那如果你的div是这样的

<div id="div1"></div>

然后样式写在了head下的标签里，或者写在了外部的css样式表里，那么你这样就获取不到了,

ok,许多同学第一时间想到了百度，没错，

百度上可能提供了一个方法，叫做currentStyle,我们可以这样来写

document.getElementById("div1").currentStyle.width

嗯，没错，我们确实是获取到了外部样式，BUT，前提你这用的是ie浏览器，根据js第二定律，js中好用的东西一定不兼容，没错，在火狐，chrome中currentStyle依然是不行的，那怎么办呢，于是又百度之，发现还有个东西叫getComputedStyle,

这东西是这样用的，getComputedStyle（你想要获取样式的元素，第二个参数随便写）.属性

所以这里得写成这样getComputedStyle（document.getElementById("div1")，null）.width

yes,火狐，chrome下终于获取到外部样式了，BUT,ie又不支持了，所以我们这里可以写一个判断 

if(document.getElementById("div1").currentStyle)

{

return document.getElementById("div1").currentStyle.width;

}else

{

return getComputedStyle（document.getElementById("div1")，null）.width;

}

这样就能完美地在ie，火狐和chrome下获取外部样式了！