本文介绍JavaScript中DOM节点的常见导航属性,包括parentNode、firstChild、lastChild、previousSibling和nextSibling,用于访问当前节点的直接相关节点。同时说明childNodes与children的区别,前者包含所有子节点,后者仅包含元素节点。
JavaScript DOM节点导航:获取父、子及兄弟节点的方法
在JavaScript中,文档中的每个节点都提供了访问其直接相关节点的能力。
parentNode属性用于获取当前节点的父节点。
firstChild属性返回当前节点的第一个子节点。
lastChild属性返回当前节点的最后一个子节点。
previousSibling属性指向紧挨着当前节点的前一个兄弟节点。
nextSibling属性指向紧挨着当前节点的后一个兄弟节点。
上述五个相关节点属性可能不存在,此时返回null。例如,document节点没有父节点,而文本节点(TextNode)没有子节点。
通过这些属性,可以实现对当前节点附近相关节点的访问,即所谓的“短途旅行”。
此外,还有childNodes数组和children数组。childNodes包含当前节点的所有子节点,包括文本节点;而children仅包含类型为元素节点的子节点,不包含文本节点。