微信小程序怎么动态获取view的高度以及获取view到页面顶部的距离

最新推荐文章于 2024-10-18 12:27:51 发布

幻想山外小楼听雨

最新推荐文章于 2024-10-18 12:27:51 发布

阅读量2.3w

点赞数 3

分类专栏：小程序笔记文章标签：小程序 dom 或者节点高度获取节点到页面顶部距离小程序动态获取

小程序笔记专栏收录该内容

24 篇文章

订阅专栏

本文介绍如何在微信小程序中使用SelectorQuery选择指定ID的节点，并获取其高度等布局信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先给你的xml对象一个id：

<view class="usermotto" style="height:213px;" id='mjltest'/>

然后在js里，用一个SelectorQuery来选择对应id的节点（注意id前面要加一个#号），就可以获取对应节点的属性，包括高度。

//创建节点选择器
var query = wx.createSelectorQuery();
//选择id
query.select('#mjltest').boundingClientRect()
query.exec(function (res) {
  //res就是 所有标签为mjltest的元素的信息 的数组
  console.log(res);
  //取高度
  console.log(res[0].height);
})

可以看到取到的高度和其他信息。