如何在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()文献MDNvar style = window.getComputedStyle(element[, pseudoElt]);获取元素宽度的示例：window.getComputedStyle(document.querySelector('#mainbar')).width

Answer 2

在……里面jQuery，你可以alert($("#theid").css("width")).-如果您还没有看过jQuery，我强烈推荐它；它可以使许多简单的javascript任务毫不费力。更新请记住，这个职位是5年前的。网络已经发展，移动，等等。有一些方法可以做到这一点的平原旧Javascript，这是更好的。