1.当我们把css的style样式写在行内标签时,我们调用时直接用 Obj.style.属性
2.但当我们把css的style样式写在了<head></head>里面时,我们需要用 Obj.currentStyle.属性 (IE浏览器专用)
var oDiv = document.getElementById('love');
alert(oDiv.currentStyle['width']);</span>
3.当我们想要用高级浏览器如CHROM时需要用 getComputedStyle(对象,null)['属性']
var oDiv = document.getElementById('love');
alert(getComputedStyle(oDiv,null)['width']);</span>
4.如何使浏览器兼容呢,我们只需要写一个方法就解决了这个问题啦
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
#abc{width: 320px;height: 300px;clear:both;margin-left:10px;display:none;}
</style>
</head>
<body>
<div id="abc">军事</div>
<script>
window.onload = function()
{
var obj = document.getElementById('abc');
alert(getStyle(obj,'width'));
}
/*兼容的函数*/
function getStyle(obj,sName) {
if (typeof(obj.currentStyle) == 'undefined') {
return getComputedStyle(obj,null)[sName];
} else {
return obj.currentStyle[sName];
}
}
</script>
</body>
</html>