首页 > 语言 > JavaScript > 正文

JS获取子、父、兄节点方法小结

2024-05-06 15:13:02
字体:
来源:转载
供稿:网友

我们在实际的开发中,经常要获取页面中某个html元素,动态更新元素的样式、内容属性等。

 我们已经知道在JavaScript中提供下面的方法获取子、父、兄节点的方法:

  常规

通过父节点获取子节点:

parentObj.firstChild                                            获取已知父节点的第一个子节点
parentObj.lastChild                                            获取已知父节点的最后一个子节点
parentObj.childNodes                                             获取已知父节点的子节点数组(这里我在IE 7中获取的是所有直接的子节点)
parentObj.children                                                  获取已知节点的直接子节点数组(在IE7中和childNodes效果一样)
parentObj.getElementsByTagName(tagName)     返回已知子节点中类型为指定值的子节点数组

通过临近节点获取兄弟节点:

neighbourNode.previousSibing                              获取已知节点的前一个兄弟节点
neighbourNode.nextSibing                                      获取已知节点的下一个兄弟节点

通过子节点获取父节点:

   1、childNode.parentNode                                             获取已知节点的父节点

上面的方法基本都是可以递归是使用的,parentObj.firstChild.firstChild.firstChild...但是这样的代码有一种傻傻的赶脚。。

  扩展

在扩展之前,我们需要知道一些关于节点基础的知识:Dom节点中,每个节点都拥有不同的类型

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选