js 元素距顶部的距离

你可以使用JavaScript中的 `offsetTop` 属性来获取一个元素距离顶部的距离。例如：

const element = document.querySelector('#myElement');
const distanceFromTop = element.offsetTop;
console.log(distanceFromTop);

这将打印出元素距离顶部的距离（以像素为单位）。请注意，如果你希望在元素还没有完全加载时获取其距离，则需要在加载完成后再运行此代码，或者使用 `window.onload` 事件来确保页面完全加载后再运行代码。

相关问题

js获取元素到顶部距离

你可以使用以下代码来获取元素到顶部的距离：

var element = document.getElementById("your-element-id");
var distance = element.getBoundingClientRect().top + window.pageYOffset;

这里的 `getBoundingClientRect()` 方法返回一个包含元素在视口中位置信息的对象。`top` 属性表示元素顶部到视口顶部的距离。 `window.pageYOffset` 表示当前页面已经滚动的距离。将它们相加即可得到元素到顶部的距离。

uniapp元素距离顶部距离

获取元素距离顶部的高度可以使用uniapp的createSelectorQuery方法和boundingClientRect方法来实现。具体步骤如下：

1. 在mounted生命周期函数中，使用uni.getSystemInfo方法获取当前屏幕的高度。
2. 使用uni.createSelectorQuery方法创建一个查询对象。
3. 使用query.select方法选择需要获取距离顶部距离的元素，并传入元素的类名或id。
4. 使用boundingClientRect方法获取元素的位置信息。
5. 在query.exec方法的回调函数中，通过res参数获取到元素距离顶部的距离。

以下是一个示例代码：

mounted() {
  let that = this;
  uni.getSystemInfo({
    success: resu => {
      const query = uni.createSelectorQuery();
      query.select('.swiper').boundingClientRect();
      query.exec(res => {
        console.log('swiper距离页面顶部的距离', res[0].top);
      });
    },
    fail: res => {}
  });
}