小程式獲取當前元素在螢幕中的位置

wxml:

<view class="usermotto" style="height:213px;" id='the-id'/>
複製程式碼

js:

const query = wx.createSelectorQuery()
query.select('#the-id').boundingClientRect()
query.selectViewport().scrollOffset()
query.exec(function (res) {
  res[0].top // #the-id節點的上邊界座標
  res[1].scrollTop // 顯示區域的豎直滾動位置
})
複製程式碼

注意：

1. 座標以元素左上角為頂點計算
2. 在在自定義元件或包含自定義元件的頁面中，應使用 this.createSelectorQuery() 來代替wx.createSelectorQuery()。

參考 :https://developers.weixin.qq.com/miniprogram/dev/api/wx.createSelectorQuery.html