轻松上手,快乐学习!
HTML CSS JAVASCRIPT SQL PYTHON MYSQL PHP GIT 问答 工具 导航 更多 实例 参考

HTML DOM getElementsByTagName() 方法

实例

更改列表中第一个 <li> 元素（索引0）的 HTML 内容:

var list = document.getElementsByTagName("UL")[0];
list.getElementsByTagName("LI")[0].innerHTML = "Milk";
亲自试一试 »

定义和用法

getElementsByTagName() 方法以节点列表对象的形式返回具有指定标记名的元素的子元素的集合。

NodeList 对象表示节点的集合。这些节点可以通过索引号访问。索引从0开始。

提示: 可以使用 NodeList 对象的 length 属性来确定具有指定标记名的子节点数，然后可以循环遍历所有节点并提取所需信息。

提示: 参数值 "*" 返回元素的所有子元素。

浏览器支持

表中的数字指定了完全支持该方法的第一个浏览器版本。

方法
getElementsByTagName() 1.0 6.0 3.0 3.0 9.5

语法

element.getElementsByTagName(tagname)

参数值

参数 类型 描述
tagname String 必需。要获取的子元素的标记名

技术细节

DOM 版本 Core Level 1 Element Object
返回值: NodeList 对象，表示具有指定标记名的元素子元素的集合。返回集合中的元素按其在源代码中的显示进行排序。

更多实例

实例

找出一个 <div> 元素中有多少 <p> 元素（使用节点列表对象的长度属性）:

var x = document.getElementById("myDIV").getElementsByTagName("P").length;
亲自试一试 »

实例

更改 <div> 元素内第二个 <p> 元素（索引1）的背景色:

var x = document.getElementById("myDIV");
x.getElementsByTagName("P")[1].style.backgroundColor = "red";
亲自试一试 »

实例

更改 <div> 元素中所有 <p> 元素的背景色:

var x = document.getElementById("myDIV");
var y = x.getElementsByTagName("P");
var i;
for (i = 0; i < y.length; i++) {
  y[i].style.backgroundColor = "red";
}
亲自试一试 »

实例

更改 <div> 元素内第四个元素（索引3）的背景色:

var x = document.getElementById("myDIV");
x.getElementsByTagName("*")[3].style.backgroundColor = "red";
亲自试一试 »

实例

使用 "*" 参数。

更改 <div> 元素内所有元素的背景色:

var x = document.getElementById("myDIV");
var y = x.getElementsByTagName("*");
var i;
for (i = 0; i < y.length; i++) {
  y[i].style.backgroundColor = "red";
}
亲自试一试 »

相关页面

JavaScript 参考手册: document.getElementsByTagName()

JavaScript 教程: JavaScript HTML DOM Node List