Question

这是我的getoffset js代码，用于获取div的宽度和左

  var objRedPacketDivStyle = document.getElementById("styRedPacketAppear");
        var objOffset = objRedPacketDivStyle.offset();
        var intWidth = objOffset.offsetWidth;
        var objWidthStart = objOffset.offset.left;
        var objWidthEnd = objWidthStart + intWidth;
        alert(objWidthStart + objWidthEnd);

这是我的div和CSS

<div class="styRedPacketAppear" id="styRedPacketAppear"></div>

#styRedPacketAppear {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 98;
pointer-events: none;
}

Answer 1

此方法不起作用，因为.offset()是jQuery方法。由于您没有jquery，因此需要使用香草javascript来实现。

您可以使用：

element.offsetWidth：“将元素的布局宽度返回为整数。” -MDN
element.offsetLeft：”返回当前元素的左上角在HTMLElement.offsetParent节点内向左偏移的像素数。” -MDN

使用这两个属性可以解决您的问题：

var objRedPacketDivStyle = document.getElementById("styRedPacketAppear");
// Remove this: var objOffset = objRedPacketDivStyle.position.offset();
var intWidth = objRedPacketDivStyle.offsetWidth;
var objWidthStart = objRedPacketDivStyle.offsetLeft;
var objWidthEnd = objWidthStart + intWidth;
alert(objWidthStart + objWidthEnd);

#styRedPacketAppear {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 98;
  pointer-events: none;
}

<div class="styRedPacketAppear" id="styRedPacketAppear"></div>

Answer 2

offsetTop属性返回相对于offsetParent元素顶部的顶部位置（以像素为单位）。返回的值包括： -元素的最高位置和边距 -offsetParent元素的顶部填充，滚动条和边框。

#test {
  top: 100px;
  margin: 10px;
  padding: 10px;
  width: 300px;
  position: fixed;
  border: 5px solid black
}

var testDiv = document.getElementById("test");
document.getElementById("demo").innerHTML = testDiv.offsetTop;

Result-offsetTop is: 110

无法获得div的偏移量

2 个答案: