小程序获取dom信息

官方文档

SelectorQuery

应用

    
1、创建选择器
  const query = wx.createSelectorQuery();
  
  将选择器的选取范围更改为自定义组件component内.(初始时,选择器仅选取页面范围的节点，不会选取任何自定义组件中的节点)
  const query = wx.createSelectorQuery().in(this);


2、查询
      获取单个
        query.select('选择器').boundingClientRect((res)=>{...})
      获取集合
        query.selectAll('选择器').boundingClientRect((res)=>{
              rect.id      // 节点的ID
              rect.dataset // 节点的dataset
              rect.left    // 节点的左边界坐标
              rect.right   // 节点的右边界坐标
              rect.top     // 节点的上边界坐标
              rect.bottom  // 节点的下边界坐标
              rect.width   // 节点的宽度
              rect.height  // 节点的高度
          }).exec()
          
3、获取dom
      目前支持Canvas的获取。
        query.select('选择器').node((res)=>{...})
    
4、在滚动视图中获取相关滚动数据
     节点必须是 scroll-view 或者 viewport，返回 NodesRef 对应的 SelectorQuery。
     
     query.select('选择器').selectViewport().scrollOffset(function(res) {
        res.id      // 节点的ID
        res.dataset // 节点的dataset
        res.scrollLeft // 节点的水平滚动位置
        res.scrollTop  // 节点的竖直滚动位置
      }).exec()