如何在javascript中获取HTML元素的样式值？

Question

如何在javascript中获取HTML元素的样式值？我正在寻找一种从样式标记设置样式的元素中检索样式的方法。<style> #box {width: 100px;}</style>在身体里<div id="box"></div>我正在寻找没有使用库的直接javascript。我尝试了以下方法，但一直收到空白：alert (document.getElementById("box").style.width);  alert (document.getElementById("box").style.getPropertyValue("width"));我注意到，只有在使用javascript设置了样式，但不能使用样式标记时，我才能使用上面的内容。

Answer 1

我相信你现在可以使用Window.getComputedStyle()

文献MDN

var style = window.getComputedStyle(element[, pseudoElt]);

获取元素宽度的示例：

window.getComputedStyle(document.querySelector('#mainbar')).width

Answer 2

在……里面jQuery，你可以alert($("#theid").css("width")).

-如果您还没有看过jQuery，我强烈推荐它；它可以使许多简单的javascript任务毫不费力。

更新

请记住，这个职位是5年前的。网络已经发展，移动，等等。有一些方法可以做到这一点的平原旧Javascript，这是更好的。