根据标签名获取HTML元素
方法名:getElementByTagName()
功能:通过传入的标签名获取对应的HTML元素,该方法能获取到所有同名的标签构成的数组
注意:标签名都是小写字母,并且不包含-和空白字符等其他字符
案例:HTML页面上放置数个h1标签,批量设置它们的内部文字
<h1></h1>
<h1></h1>
<h1></h1>
<h1></h1>
<h1></h1>
<script>
//通过标签名得到页面中的元素组,保存到对象oH1中
var oH1 = document.getElementsByTagName("h1");
//批量给h1标签内部加编号文字
for(var i=0;i<oH1.length;i++){
oH1[i].innerHTML="我是第"+(i+1)+"个h1标签";
}
</script>
编程练习
编写html页面,然后在后面编写js代码,要求实现给id为t的ul列表中的所有列表项编号。
<ul>
<li>没有被JS编号的li标签</li>
<li>没有被JS编号的li标签</li>
</ul>
<ul id="t">
<li>没有被JS编号的li标签</li>
<li>没有被JS编号的li标签</li>
<li>没有被JS编号的li标签</li>
</ul>
<ul>
<li>没有被JS编号的li标签</li>
</ul>
</body>
<script>
var oH2 = document.getElementById("t");
var oH3 = oH2.getElementsByTagName("li");
for(var i=0;i<oH3.length;i++){
oH3[i].innerHTML="我是第"+(i+1)+"个li标签";
}
实现效果: