current style 获得css属性

最新推荐文章于 2020-12-20 03:25:18 发布

cai555

最新推荐文章于 2020-12-20 03:25:18 发布

阅读量324

点赞数

文章标签： CSS IE JavaScript ViewUI

javascript 程序在第一次获得一个页面对象，比如var el = document.getElementById('div1'); 这个时候如果你取el.style.width，你可能得到的值为''值，除非你设置了el.style.width，比如el.style.width="200px";然后你再alert(el.style.width);这时才会弹出'200px'。可是css里面明明设置了这个值为什么没有值呢，原来初始值不再style.width里面，在currentstyle里面，调用以下代码，即使在第一次取style的值也是可行的（IE，FF测试通过）：


<style type="text/css">
#test{
width: 100px;
height: 80px;
background-color: yellow;
}
</style>
<body>
<div id="test">This is some text</div>

<script type="text/javascript">

var mydiv=document.getElementById("test")

function getCurrentStyle(obj, cssproperty, csspropertyNS){
	if(obj.style[cssproperty]){
		return obj.style[cssproperty];
	}
	if (obj.currentStyle) {// IE5+
		return obj.currentStyle[cssproperty];
	}else if (document.defaultView.getComputedStyle(obj, null)) {// FF/Mozilla
		var currentStyle = document.defaultView.getComputedStyle(obj, null);
		var value = currentStyle.getPropertyValue(csspropertyNS);
		if(!value){//try this method
			value = currentStyle[cssproperty];
		}
		return value;
	}else if (window.getComputedStyle) {// NS6+
		var currentStyle = window.getComputedStyle(obj, "");
		return currentStyle.getPropertyValue(csspropertyNS);
	}
}
alert(getCurrentStyle(mydiv, "backgroundColor", "background-color")); //alerts "yellow"
</script>

cai555

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
current style 获得css属性

javascript 程序在第一次获得一个页面对象，比如var el = document.getElementById('div1'); 这个时候如果你取el.style.width，你可能得到的值为''值，除非你设置了el.style.width，比如el.style.width="200px";然后你再alert(el.style.width);这时才会弹出'200px'。可是css里面明明...
复制链接

扫一扫