style是提取行间样式来的,如果我们的style不在行间,而且在别的地方,我们就不能通过.style.width 这类的带来来调取的了,我们可以通过IE下的oDiv.correntStyle.width来调取非行间样式(这时候FF不兼容),也可以通过getComputedStyle(oDiv,false).wigth来调取非行间样式,(这时候IE7又不兼容了);我们可以通过真假的思路来写兼容代码;首先我们要判断oDiv.correntStyle的真假,这个在IE下是一串字符(真),在FF下是undefined(假);

 

我们通过IF来判断是在哪个浏览器,如果是真的,执行IE下的代码,else则执行FF下的代码;

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
#div1 {width:200px; height:200px; background:red};
</style>
<script>
window.onload=function()
{
var oDiv=document.getElementById('div1');
//alert(oDiv.style.width);
//IE浏览器可以用下面的这个来获取非行间样式;
//alert(oDiv.currentStyle.width); //只是IE下面可以用;
//底版chrome,FF用下面的来写;
//alert(getComputedStyle(oDiv,false).width) //只是FF这些可以用;里面是2个字符,一个是获取的变量,一个是垃圾,垃圾这个可以放些没用的东西;

//alert(oDiv.currentStyle) //在IE下是一串字符(真的),在FF下是undefined(假的)
//上面是测试oDiv.currentStyle是否为真的,通过真假的思路,我们可以解决浏览器兼容性问题;
//下面是通过判断计算器数值的真假,来解决浏览器的兼容性问题;
if(oDiv.currentStyle)
{
//因为是真的,执行IE的代码
alert(oDiv.currentStyle.width);
}
else
{
alert(getComputedStyle(oDiv,false).width)
}
}
</script>
</head>
<body>
<div id="div1"></div>
</body>
</html>