javascript - 如何在js中访问id样式的属性

Question

我对 Web 开发有点陌生，我试图访问我网站中的 id.style 属性，但不幸的是我的程序没有响应，所以我在这段代码中上传了我的问题。还请告诉我如何更改该值。

function myMove() {
  var elem = document.getElementById("container");
  alert(elem.style.top);

}

#container {
  width: 400px;
  height: 400px;
  top: 10px;
  position: relative;
  background: yellow;
}

<p><button onclick="myMove()">Click Me</button></p>
<div id="container"></div>

Answer 1

您可以使用window.getCompulatedStyle()访问您想要的CSS值

参见MDN for more details

但您可能真正想要的是 element.offsetTop;

参见MDN here for that

function myMove() {
  var elem = document.getElementById("container");
  var computedStyles = window.getComputedStyle(elem)
  var top = computedStyles.getPropertyValue('top')
  alert(top);
  alert(elem.offsetTop);
}