![]() |
| 首页 > 编程 > ajax > JavaScript |
1
1楼 cai555 2008-03-01
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>
2楼 hax 2008-03-01
注意,标准的getComputedStyle和IE的currentStyle实质上是不同的。前者返回的是CSS规范所定义的计算后的值(computed value),而IE的CSS处理模型并不完全符合规范的要求。
虽然普通使用时差别并不是很大,但是差别越是微妙,其实越令人挠头。 3楼 hax 2008-03-01
比方说computed value都是绝对值,即em会被转换为px或其他绝对长度(在打印机上也许转换成cm?)。
4楼 cai555 2008-03-03
多谢hax提醒,受教了
搜索墙@2009 www.pkwall.com all rights reserved QQ:276471788 [京ICP备09111534号]
声明:本站部分数据来源于网络,仅供参考,如有版权问题,请联系我们,我们将及时删除!转载本站请注明来源
| |||||