小程序获取dom信息

这篇具有很好参考价值的文章主要介绍了小程序获取dom信息。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

官方文档

SelectorQuery文章来源地址https://www.toymoban.com/news/detail-612517.html

应用

    
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()
          

到了这里,关于小程序获取dom信息的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包