Question

我以3种方式插入css

内联样式（p1）
内部样式表（第2页）
外部样式表（第3页）

我希望通过Javascript＆amp;＆amp;获得每个css的价值Jquery。请告诉我如何。

我不能以与p1相同的方式获得p2，p3的值。怎么了？

非常感谢！

＆＃13;

window.onload = abc();

function abc(){
	var p1 = document.getElementById('p1').style.height;
	document.getElementById('p1').innerHTML = p1;
	var p2 = document.getElementById('p2').style.width;
	document.getElementById('p2').innerHTML = p2;
	var p3 = document.getElementById('p3').style.height;
	document.getElementById('p3').innerHTML = p3;
}

＆＃13;

#p3{
	width: 200px;
	height: 200px ; 
	background-color: aqua ;
}

＆＃13;

<!DOCTYPE html>
<head>
<title>CSS Element output</title>
	
</head>
<body>
<H1>CSS output element property</H1>
	<div id="p1" style="height:50px;width:100px;">check p1</div>
	<div id="p2">check p2</div>
	<style>
		#p2{
			height:50px;
			width:400px;
			background-color: bisque
		}
	</style>
	<div id="p3">check p3</div>
	
</body>

＆＃13;

**

强文

**

Answer 1

使用点表示法时，您要求输入属性。只有第一个元素具有style属性，所以这就是为什么只有你的第一次尝试才有效。

Answer 2

您可以使用window.getComputedStyle();和getPropertyValue();获取样式属性的值请参阅下面的示例代码，了解元素p2的高度值：

var element = document.getElementById('p2'),
    style = window.getComputedStyle(element),
    res = style.getPropertyValue('height');

alert(res);

通过JS和Jquery获取CSS元素值

强文

2 个答案: