javascript - 如何仅使用 JavaScript 从元素当前位置减去像素？

Question

在不使用 jQuery 的情况下，有没有办法获取元素的当前位置并从中添加/减去？假设一个元素有这个 CSS

position: relative;
top: 400px;
/*400px away from the top*/

JavaScript 可以从“顶部”获取像素数量并从中减去吗？我知道我可以使用 document.getElementById("element").style.top 直接编辑 top 属性，但是我想先获取值本身，然后从该值中减去一些像素，然后放入新值作为位置。这可能吗？

标签： javascripthtmlcss

Answer 1

像这样的东西？从视口顶部获取位置，然后减去一个值并返回新的“与顶部值的偏移量”：

const offsetValue = 49

const findNewPosition = (offset) => {

  const element = document.querySelector('#elementId').getBoundingClientRect().top
  return element - offset
}

findNewPosition(offsetValue)