为什么element.style在JS中总是返回空？

  • Z时代
  • 2024-01-10
  • 分类：问答

display:block在CSS中定义时，element.style.display总是返回空。

console.log(document.getElementById('test').style.display)
#map {display: block;}
<div id="test">test</div>

但是，如果您在该元素中设置样式，则可以获取style.display详细信息。

    console.log(document.getElementById('test').style.display)
 <div style="display:none" id="test">test</div>

我的问题不同。

内联样式不是编码的好方法。因此，我们总是在CSS中分配样式。但是，为什么在提供style属性CSS而不是通过element

时却显示为空？JavaScript是否特别无法读取cssstyle属性？

您可以在下面检查，即使我提供了，所有样式属性都为空display: block; align-content:center;。 

console.log(document.getElementById('test').style)
#map {display: block;align-content:center;}
<div id="test">test</div>

回答：

element.style返回html文档中使用的内联样式，由于该样式不是直接在html中设置的，因此您将获得且值为空

您正在寻找的是computeedStyle，它将返回应用于元素的样式

console.log(window.getComputedStyle(document.getElementById('test')).display)
#map {
      display: block;
      align-content:center;
    }
<div id="test">test</div>

以上是 为什么element.style在JS中总是返回空？ 的全部内容， 来源链接： utcz.com/qa/417708.html

回到顶部