js获取html节点的子节点,Js 获取HTML DOM节点元素的方法小结-CSDN博客

本文总结了JavaScript获取HTML DOM节点的各种方法，包括通过document节点、父节点、临近节点和子节点获取。讨论了getElementById、getElementsByTagName、firstChild、lastChild等属性和方法的用法，并提到了浏览器兼容性问题。

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

Js 获取HTML DOM节点元素的方法小结

如何获取要更新的元素，是首先要解决的问题。令人欣慰的是，使用JavaScript获取节点的方法有很多种，这里简单做一下总结(以下方法在IE7和Firefox2.0.0.11测试通过)

1. 通过顶层document节点获取：

(1) document.getElementById(elementId) ：该方法通过节点的ID，可以准确获得需要的元素，是比较简单快捷的方法。如果页面上含有多个相同id的节点，那么只返回第一个节点。

如今，已经出现了如prototype、Mootools等多个JavaScript库，它们提供了更简便的方法：$(id)，参数仍然是节点的id。这个方法可以看作是document.getElementById()的另外一种写法，不过$()的功能更为强大，具体用法可以参考它们各自的API文档。

(2)document.getElementsByName(elementName) ：该方法是通过节点的name获取节点，从名字可以看出，这个方法返回的不是一个节点元素，而是具有同样名称的节点数组。然后，我们可以通过要获取节点的某个属性来循环判断是否为需要的节点。

例如：在HTML中checkbox和radio都是通过相同的name属性值，来标识一个组内的元素。如果我们现在要获取被选中的元素，首先获取改组元素，然后循环判断是节点的checked属性值是否为true即可。

(3)document.getElementsByTagName(tagName) ：该方法是通过节点的Tag获取节点，同样该方法也是返回一个数组，例如：document.get