JS获取当前样式得函数

最新推荐文章于 2021-01-28 17:40:10 发布

senwei.zhang

最新推荐文章于 2021-01-28 17:40:10 发布

阅读量320

点赞数

分类专栏： HTML+CSS+JS

本文链接：https://blog.csdn.net/SoWhatWorld/article/details/104291515

版权

HTML+CSS+JS 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

JS获取当前样式函数封装：

<!DOCTYPE html>
<html>
<head>
	<title>返回当前样式封装函数</title>
	<style type="text/css">
		div {
            width: 100px;
            height: 200px;
            position: absolute;
            top: 10px;
            left: 20px;
            background-color: pink;
            z-index: 2;
            opacity:  0.4;
        }
	</style>
</head>
<body>
<div id="demo"></div>
</body>
</html>

<script type="text/javascript">
	var demo = document.getElementById("demo");
	function getStyle(obj, attr){
		if (obj.currentStyle) {
			// IE浏览器识别
			return obj.currentStyle[attr];
		} else {
			return window.getComputedStyle(obj, null)[attr];
		}
	}


	console.log(getStyle(demo, "width"));
	console.log(getStyle(demo, "background-color"));
</script>