1949啦网--小小 痛苦,是因为能力和欲望不匹配造成的

JS对元素样式的操作

如果想用javascript获取一个元素的样式信息,首先想到的应该是元素的style属性。但是元素的style属性仅仅代表了元素的内联样式,如果一个元素的部分样式信息写在内联样式中,一部分写在外部的css文件中,通过style属性是不能获取到元素的完整样式信息的。

<!DOCTYPE html>      <html>      	<head>      		<meta charset="UTF-8">      		<title></title>      		<style type="text/css">      			#hd{      				width: 500px;      				height: 300px;      				background: olive;      				margin: 50px auto;      			}      		</style>      		<script type="text/javascript">      			window.onload = function(){      				var hd = document.getElementById('hd');      //				alert(hd.style.width);   这亲是获取不了的,因为下面body id里面没有设置      //				这个写法有两种浏览器,先判断浏览器(这种写法可以不管是行内样式,还是嵌入样式,引入导入样式通通可以能获得最终的样式(这里例如写一个宽度))      				if (document.all) {//IE      					var w = hd.currentStyle.width;      //					background比较特殊,这样写是获得不了背景颜色的      //					var w = hd.currentStyle.background;      //					要这样写,才能获得背景颜色 下面的W3C标准的那个会以rgb()形式体现出来的      //					var w = hd.currentStyle.backgroundColor;      				} else{//W3C标准浏览器      //					(hd,mull)括号里有两个参数,第一个是你要获得谁的样式'hd',第二个是'null'我也不知道是什么意思,反正要写      					var w = getComputedStyle(hd,null).width;      //					background比较特殊,这样写是获得不了背景颜色的      //					var w = getComputedStyle(hd,null).background;      //					同上      //					var w = getComputedStyle(hd,null).backgroundColor;      				}      				alert(w);      			}      		</script>      	</head>      	<body>      		<div id="hd"></div>      	</body>      </html>

原文链接:https://www.qiquanji.com/post/7088.html

本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。

微信扫码关注

更新实时通知

作者:xialibing 分类:网页教程 浏览: