javascript - 如何在 Javascript 中使用 ComputedStyle 获取边框宽度？

Question

以下命令

window.getComputedStyle(box).getPropertyValue("border")

正在返回

"0.994318px solid rgb(255, 0, 0)"

如何使用 ComputerStyle 获得边框宽度？有没有办法用另一个替换“边界”参数，所以在上述情况下，它会输出

0.994318px

Answer 1

类似于为什么 .getPropertyValue() 不会为“borderRadius”属性返回值？

指定你想要的确切的 CSS 属性，所以 'border-width'

编辑：正如@HereticMonkey 指出的（我在链接的帖子中错过了），在 Firefox 中，您需要对您的属性进行非常精细的处理。所以在border-width的情况下，你需要得到准确的边框，例如border-bottom-width。

Answer 2

要从类中获取“border-top-width”：

<style>.mystyle{border:8px solid grey;padding:10px;}</style>

<div id="xyz" class="mystyle">just testing</div>

var mydiv = document.getElementById('xyz');

var borderTop = parseInt(getComputedStyle(mydiv).getPropertyValue("border-top-width").replace('px',''));

console.log('borderTop:'+borderTop);// -> 8