Question

我有一个关于要获取X ID的问题 document.getElementById（“ X”）。style.backgroundColor 这是我的HTML：

<div id ="X" class="main-sidebar text-white "> 

      </div>

CSS之类的

.main-sidebar{
background-color: #343a40;
width:10%;
height:100%;
display:block;
position: absolute;
left:0px;
/*top:0px;*/
}

但是当我在js中使用document.getElementById（“ X”）。style.backgroundColor时，我会得到NULL值...

Answer 1

这是因为style引用了HTML中的内联style属性。如果只想通过CSS设置style，则需要使用computedStyles。

const elem = document.getElementsByTagName('p')[0]; // get element
const styles = window.getComputedStyle(elem); // get computed style of element
console.log(styles.getPropertyValue('background-color')); // get specific attribute

p {
  background-color: red;
}

<p>Hi!</p>

Answer 2

尝试使用计算样式：

window.getComputedStyle(document.getElementById("X")).backgroundColor

Answer 3

execute_from_command_line将获得或设置元素的内联样式。在您的情况下，.style的样式位于.css文件中。您可以使用.main-sidebar： getComputedStyle()

关于js获取背景色

3 个答案: