如何从JavaScript的外部样式表派生元素样式?
问题描述:
每当我使用这种类型的JavaScript代码来欣赏元素的背景颜色时,它总是返回“”。如何从JavaScript的外部样式表派生元素样式?
<style><!--From external stylesheet-->
#divexample{
background-color:#4345C7;
}
</style>
<div id="divexample"></div>
<script type="text/javascript">
var bgColor=document.getElementById("divexample").style.backgroundColor;
alert(bgColor);
</script>
答
您可能要考虑使用jQuery
。然后,您可以轻松获得backgroundColor
:
var bgColor = $("#divexample").css("backgroundColor");
答
检查:
http://jsfiddle.net/h28zdhtc/4/
<style>
div {
width: 60px;
height: 60px;
margin: 5px;
float:left;
}
div.div1{background-color:blue;}
div.div2{background-color:black;}
div.div3{background-color:green;}
div.div4{background-color:red;}
</style>
<span id="result"> </span>
<div class="div1"></div>
<div class="div2"></div>
<div class="div3"></div>
<div class="div4"></div>
<script>
$("div").click(function() {
var color = $(this).css("background-color");
$("#result").html("That div is <span style='color:" +
color + ";'>" + color + "</span>.");
});
</script>
更多细节请参阅本:
前加载你的风格JS? – Shomz 2014-09-28 00:44:49
检查[MSDN](https://developer.mozilla.org/en/docs/Web/API/window.getComputedStyle)。 – 2014-09-28 00:50:50