获取元素css样式

最新推荐文章于 2024-06-07 10:30:53 发布

青沐沐

最新推荐文章于 2024-06-07 10:30:53 发布

阅读量664

点赞数

分类专栏： JavaScript 文章标签：获取css样式的兼容写法 js获取css样式

本文链接：https://blog.csdn.net/wulianwangxuchenqi/article/details/97301619

版权

JavaScript 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>获取样式的封装函数</title>
		<style type="text/css">
			#box{
				width: 200px;
				height: 100px;
				background: #A6F188;
			}
		</style>
	</head>
	<body>
		<div id="box"></div>
		<script type="text/javascript">
			var div = document.getElementById("box");
			//获取某个元素的css样式,浏览器兼容
			function getStyle(domobj,attr){
				if(window.getComputedStyle){
					return getComputedStyle(domobj,null)[attr];//现代浏览器
					//return getComputedStyle(domobj,null).attr;
				}else{
					return domobj.currentStyle(attr);//支持IE低版本
				}
			}
			var w = getStyle(div,"width");
			var h = getStyle(div,"height");
			var color = getStyle(div,"background");
			console.log(w,h,color);
		</script>
	</body>
</html>

青沐沐

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
获取元素css样式

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>获取样式的封装函数</title> <style type="text/css"> #box{ width: 200px; height: 100px; ...
复制链接

扫一扫

专栏目录