0 1 4 1 ★ 获取元素之getElementsByTagName |【获取】
本帖最后由 不二如是 于 2017-6-14 22:42 编辑http://xxx.fishc.com/forum/201706/11/102001hz9kdpzdwkwdpwy9.png
在0 1 1 9 ★★ BOM与DOM （88-118）| 【总结】入门级别，介绍了getElementsByTagName方法。
现在深入死磕下这个方法。
getElementsByTagName方法返回一个对象数组，每个对象分别对应着文档里有着给定标签的一个元素。
该方法只有一个参数，标签名。语法：
document.getElementByTagName("标签名");
在0 1 4 0 介绍的getElementById也是返回一个值，只不过是对象。
而getElementsByTabgName方法返回的是一个对象数组。
千万别搞混了～（我猜说完，就更容易搞混了）
上一个简单的例子：
document.getElementsByTagName("li");
这个调用将返回一个对象数组，每个对象分别对应着document对象中的一个列表项元素。
与任何其他的数组一样，我们可以利用length属性查出这个数组里的元素个数。
现在继续在下面这段代码中进行实验：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>鱼C工作室</title>
</head>
<body>
<h1>鱼C-Web开发</h1>
<p title="slogan">Change the World By Program</p>
<ul id="class">
<li>HTML5-庖丁解牛</li>
<li class="star">JavaScript-庖丁解牛</li>
<li>PHP&MySQl-庖丁解牛</li>
</ul>
</body>
</html>
★第一步，利用getElementByTagName查找：
document.getElementsByTagName("li");
★第二步，利用循环语句，输出上面查找到的内容
for(var i = 0 ; i <document.getElementsByTagName("li").length ; i++ )
{
alert("typeof document.getElementsByTagName("li")");
}
★启动程序，看结果，显示3个object
从代码可读性来讲，上面的写法是极其恶心滴·
只需要引入一个变量，即可让代码变的干净漂亮(上述原因，也是变量被发明的原因之一)：
var items = document.getElementsByTagName("li");
for(var i = 0 ; i < items.length ; i++)
{
alert(typeof items);
}
getElementsByTabgName，允许使用通配符（*），然后就能知道整个文档中的元素个数。
修改代码：
var a = document.getElementsByTagName("*").length;
console.log(typeof a);
console.dir(a);
我想要看看id为class的<ul>，包含了哪些元素怎么办？
在之前咱们讲过getElementById可以用来找到id，再结合上面的通配符，理论上就可以完成任务哈～
上代码：
//先找到id，并存储到findId变量中
var findId = document.getElementById("class");
//基于findId，进一步查找其内所有元素
var findLi = findId.getElementsByTagName("*");
//循环输出
for(var i = 0 ; i < findLi.length ; i++)
{
console.log(findLi);
}
这位鱼油，如果喜欢本系列Js帖子，请订阅 专辑☞（传送门）（不喜欢更要订阅{:10_297:} ） H5新语法一般是用document.querySelectorAll(selectors);这个了，用的css3选择器非常方便{:10_254:} 突然就感觉jq的$是多么伟大{:10_299:}{:10_299:}{:10_261:} 报告老师 你确定
alert("typeof document.getElementsByTagName("li")");
输出的不是字符串 ？ “getElementsByTabgName，允许使用通配符（*），然后就能知道整个文档中的元素个数”，捉个虫，多了一个b 好像那个alert一直都没弹出来，就是正常显示的字符串
页:
[1]