getElementsByTagName()

Posted 2020-08-16 青竹zzq

getElementsByTagName()：方法的用途是寻找有着给定标签名的所有的元素。

element = document.getElementsByTagName(tagName);

这个方法返回一个节点的集合，这个集合可以当做一个数组来处理。这个集合的length属性等于当前文档里有着给定标签名的所有元素的总个数。这个数组里面的每个元素都是一个对象，他们都有着nodeName、nodeType、parentNode、childNodes等属性。

下面的例子将把当前文档里的所有文本段元素（p元素）全部搜索出来，getElementsBuTagName()方法返回的节点集合的length属性将被保存到变量howmany里：

var paras = document.getElementsByTagName("p");
var howmany = paras.length;

在getElementsByTagName()方法返回成功后，比较常见的后续手段是用一个for循环去遍历这个方法所有返回的集合里面的各个元素，在for循环里，我们可以使用setAttribute()、clone()或appendChild()等方法对各个有关元素进行查询处理。

下面的例子将遍历当前文件里面的所有文本段元素，并将其title属性全部设置为空字符串：

var paras = document.getElementsByTagName("p");
for ( var i=0;i<paras.length;i++ ) {
    paras[i].setAttribute("title","");      
}

在上例中，变量paras的数据类型是nodeList。这个集合里的每一个元素可以像其他任何一个数组那样进行访问：paras[0]、paras[1]、paras[2]等等。当然也可以使用item()方法：paras.item[0]等等

getElementsByTagName()方法不必非得用在整个文档上，他也可以用来在某个特定的元素的子节点当中寻找持有者给定标签名的元素。

在下例中，在当前文档里包含着一个id属性值是content元素，为了找出content元素所包含的所有文本段元素，我们把getElementsByTagName()方法用在了content上：

var container = document.getElementById("content");
var paras = container.getElementsByTagName("p");
var howmany = paras.length;

执行完上面的这些语句后，变量howmany的值将是包含在content元素里的所有文本元素的总分数，而不是包含在文档里面文本段总个数。