浏览 412 次
|
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
时间：2008-03-01 关键字: javascript current style
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>
声明：JavaEye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
|
| 返回顶楼 | |
|
时间：2008-03-01
注意，标准的getComputedStyle和IE的currentStyle实质上是不同的。前者返回的是CSS规范所定义的计算后的值（computed value），而IE的CSS处理模型并不完全符合规范的要求。
虽然普通使用时差别并不是很大，但是差别越是微妙，其实越令人挠头。 |
| 返回顶楼 | |
|
时间：2008-03-01
比方说computed value都是绝对值，即em会被转换为px或其他绝对长度（在打印机上也许转换成cm？）。
|
| 返回顶楼 | |
|
时间：2008-03-03
多谢hax提醒,受教了
|
| 返回顶楼 | |
