<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#div1{
width: 100px;
height: 200px;
background-color: yellow;
font-size: 50px;
}
</style>
</head>
<body>
<div id="div1" style="background-color:red"></div>
<script type="text/javascript">
var oDiv1 = document.querySelector("#div1");
var prop = "backgroundColor";
// alert(oDiv1.style.backgroundColor);
// 但凡遇到.的地方，都可以用[]里面加字符串的形式替代
// 或 alert(oDiv1.style[prop]);
// oDiv1.style[prop] = "blue";
// 获取非行间样式
// 参数1 ： 想获取哪个元素
// 参数2 ： 没什么用 一般写false
// [] 里面写你想获取的属性字符串
// chrome ff 好用
// alert(getComputedStyle(oDiv1,false)["width"]);
// IE 兼容的方法
// alert(oDiv1.currentStyle["height"]);
// 参数1：获取哪个元素
// 参数2： 获取这个元素的哪个样式
function getStyle(obj,name){
if (obj.currentStyle) {
return obj.currentStyle[name];
} else{
return getComputedStyle(obj,false)[name];
}
}
alert(getStyle(oDiv1,"fontSize"));
</script>
</body>
</html>
扫一扫
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
