2024年6月7日发(作者：)

JS中getElementById()、getElementsByName()、getElementsByTagName() 的区别和应用

getElementById() 方法可返回对拥有指定 ID 的第一个对象的引用

语法：mentByIdx_x_x(id)

getElementsByName() 方法可返回带有指定名称的对象的集合

语法：mentsByName(name)

两者的不同点：

（1）该方法与 getElementById() 方法相似，但是它查询元素的 name 属性，而不是 id 属

性。

（2）因为一个文档中的 name 属性可能不唯一（如 HTML 表单中的单选按钮通常具有相

同的 name 属性），所有 getElementsByName() 方法返回的是元素的数组，而不是一个元素。

getElementsByTagName_r() 方法可返回带有指定标签名的对象的集合，返回元素的顺序是它

们在文档中的顺序。

语法：mentsByTagName_r(tagname)

提示：

(1)如果把特殊字符串 "*" 传递给 getElementsByTagName_r() 方法，它将返回文档中所有元

素的列表，元素排列的顺序就是它们在文档中的顺序。

(2)传递给 getElementsByTagName_r() 方法的字符串可以不区分大小写。

例子1：

这是标题1

点击标题，会提示出标题1的值。

点击表单框，会提示出表单中的值。

例子2：

value="How many elements named 'myInput'?" />

例子3：

getElementById:

语法： mentByIdx_x(id)

参数： id :必选项为字符串(String)

返回值：对象; 返回相同id对象中的第一个,如果无符合条件的对象，则返回 null

example：mentByIdx_x("id1").value;

getElementsByName:

语法： mentsByName(name)

参数： name :必选项为字符串(String)

返回值：数组对象; 如果无符合条件的对象，则返回空数组

example：mentsByName("name1")[0].value;

mentsByName("name1")[1].value;

getElementsByTagName:

语法： mentsByTagName_r(tagname) object可以是document

Element等

参数： tagname:必选项为字符串(String)

返回值：数组对象; 如果无符合条件的对象，则返回空数组

example：mentsByTagName_r("p")[0].childNodes[0].nodeValue;

mentsByTagName_r("p")[1].childNodes[0].nodeValue;

--------------------------------------------------------------------------------

getElementsByTagName_r() 不只是用在全局，更多的用法是：

mentsByTagName_r();

obj可以是任何对象。

--------------------------------------------------------------------------------

var all = mentsByTagName_r('div')[0].getElementsByTagName_r('*');

就是取mentsByTagName_r('div')[0]这个节点下边的所有。

准确的说应该是所有Element类型的节点，不包括TextNode类型的节点。

getElementsByTagName_r('*') *就像通配符一样，表示所有的TagName。

--------------------------------------------------------------------------------

mentsByTagName_r('ul')[0].childNodes就是li的数组

它的长度就是li的个数

或