微信小程序 - 动态获取元素宽高

小程序提供了对应的api接口 wx.createSelectorQuery() 来获取对象实例。

用法：

这个接口会返回一个对象实例。
var query = wx.createSelectorQuery();

返回有5个方法
1. query.in(component)：
2. query.select(selector)：获取指定的节点，selector是css选择器。返回一个NodesRef对象实例
3. query .selectAll(selector)：获取指定的节点，selector是css选择器。返回一个NodesRef对象实例
4. query.selectViewport()：
5. exec( function(res){} )：

上面返回的 NodesRef 有三个方法：
1. boundingClientRect( function(rect){} )：动态获取view元素的高度、宽度等属性
2. scrollOffset( function(res) {}）：获取节点的水平、垂直滚动的位置。须是scroll-view或viewport
3. fields(fields,function(){res} )：这个可以获取指定元素的自定义属性和class名

实际获取宽高实例

//wxml
<view class='every'></view>
<view class='every'></view>

//js
 let that = this;
 let query = wx.createSelectorQuery();  //创建节点选择器
 query.select('.every').boundingClientRec