Question

我想用javascript从css文件中获取一个元素样式。但是，我只能获得我在javascript上输入样式属性的元素。我在Angular上尝试过这样的事情;

angular.element(document.getElementById("box")).css("width")

没用。之后，我试着这样;

document.getElementById("box").style

但它没有奏效。我怎么能做到这一点？

Answer 1

这不是一个Angular问题，它只是CSS和Javascript的交互方式。您需要使用getComputedStyle来读取CSS文件中定义的样式属性。

＆＃13;

// This will work (because it's an inline style)
console.log(document.getElementById('a').style.width)

// This won't work (because the style was defined in css):
console.log(document.getElementById('b').style.width)

// getComputedStyle will work regardless of the source:
console.log(window.getComputedStyle(document.getElementById('b')).width)

＆＃13;

#b {width: 100px}

＆＃13;

<div id="a" style="width: 100px">A</div>
<div id="b">B</div>

＆＃13;

Answer 2

除非已设置，否则无法获取调用样式属性的元素的css模板规则值 * 1。在html元素级别使用内联样式;要么 * 2。 style属性已使用JavaScript

设置

执行相同的操作：写入目标元素的内联html样式属性。

解决方案是使用计算出的样式：

如：getComputedStyle(box,0).width

使用javascript从css文件中获取元素的样式

2 个答案: