首页 > 代码库 > 笔记-[1]-获取元素样式值的兼容性问题解决方法。
笔记-[1]-获取元素样式值的兼容性问题解决方法。
在获取某些元素的样式值时需要用到不同的兼容方法来获取,如获取div的height的值
代码:
<html>
<style>
#div1{width:100px;height:100px;background:red;}//获取非行间样式
</style>
<div id="div1">
</div>
</html>
JS兼容版获取样式值:
<script type="text/javascript">
window.onload=function(){
//定义一个function getStyle
var oDiv=document.getElementById(‘div1‘);
function getStyle(obj,attr){
if(obj.currentStyle){
return obj.currentStyle[attr];//ie下
}else{
return getComputedStyle(obj,false)[attr];//非ie下
}
}
//调用方法获取值
getStyle(oDiv,‘width‘);//100px
}
</script>
/*主要的兼容代码*/
function getStyle(obj,attr){
if(obj.currentStyle){
return obj.currentStyle[attr];//ie下
}else{
return getComputedStyle(obj,false)[attr];//非ie下
}
}
或者
return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj,false)[attr];