js抓取指定的子节点

本文介绍了一个JavaScript函数,用于从给定的DOM对象中获取第一个子元素,如果该子元素是DIV,则修改其值并返回。

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

function getChildOfDIV(objId){
  var labels = objId.childNodes;
	var rlabel;
  for(var i = 0; i < labels.length; i++){
   var label = labels[i];
   if ("DIV" == label.nodeName){
    label.value = i;
		rlabel = label;
		break;
   }
  }
	return rlabel;
}


 

### 使用 `wx.createSelectorQuery` 实现子组件获取父组件节点 在微信小程序中,可以通过 `wx.createSelectorQuery()` 方法创建一个查询对象,在该对象上调用各种选择器方法来选取节点,并通过回调函数获得所需的信息。对于子组件来说,要访问其父级组件中的某个特定节点,则可以利用此 API 并结合 `.in(component)` 来指定当前的选择是在哪个组件的作用域下进行。 下面是一个具体的例子展示如何在一个子组件内部获取到它所在页面上的任意元素的位置信息: ```javascript Component({ methods: { getParentNodeInfo() { const query = wx.createSelectorQuery().in(this); // 创建查询并限定作用范围为本组件 // 查询父级容器下的目标节点(假设有一个类名为 'parent-node' 的 div) query.select('.parent-node') .boundingClientRect((rect) => { if (!rect) return; console.log(`Parent node top position is ${rect.top}px`); }) .exec(); // 执行所有的select操作并将结果返回给对应的callback } }, lifetimes: { attached: function () { setTimeout(() => { this.getParentNodeInfo(); }, 1000); } } }); ``` 在这个案例里,当组件挂载完成后等待一秒再发起请求是为了确保 DOM 已经完全渲染完毕[^3]。 需要注意的是,由于父子关系的存在以及可能存在的多个同名标签的情况,建议尽可能精确地定位所需的父级节点,比如使用唯一的 ID 或者更具体的选择器路径以减少误匹配的可能性。 另外一种方式是让父组件主动传递自身的某些属性或状态给子组件,这样即使不直接抓取DOM也可以间接实现数据共享的目的[^4]。 #### 注意事项 - 如果想要获取整个视窗内的绝对位置而非相对位置的话,可以在调用 `boundingClientRect` 后继续链式调用 `scrollOffset`. - 对于动态加载的内容,应该考虑延迟执行或者监听相关事件后再去查询节点.
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值