JavaScript 样式 class return 空字符串

Question

当我使用 JavaScript 上的 style 属性作为存在元素时，它 return 对我来说是一个空字符串

alert(element.style.width);

JavaScript return 一个空的警告框我用许多预先声明的 css 属性尝试了这个，但输出相同

var images =    document.querySelectorAll(".slider_image");

document.getElementById("next").onclick = function() {
   for (var i = 0; i < images.length; i++) {
   alert(images[i].style.width);
   }
};

这是 html

  <div id="first-part">
  <div id="slider">
    <img src="img/1.jpg" class="slider_image" id="1"/>
    <img src="img/2.jpg" class="slider_image" id="2"/>
    <img src="img/3.jpg" class="slider_image" id="3"/>
    <img src="img/next.png" id="next-img"/>
  </div>
  <span id="next">Next</span>  <span id="before">Before</span>
</div>

这是我的 css :

.slider_image{
  width:100%;
  position:relative;
  right:0px;
}

这可能是什么原因造成的？

Answer 1

.style 对象仅包含直接在 DOM 元素上设置的样式属性。从 CSS 确定的属性不会以这种方式显示。

JavaScript 样式 class return 空字符串

The JavaScript style class return empty string

javascript

html

css

dom