HTML DOM getElementsByTagName() 方法

什么是 getElementsByTagName() 方法

getElementsByTagName() 方法是 DOM 中的一个常用方法,它可以根据标签名称获取文档中所有指定标签的元素,并将它们以一个 HTMLCollection 的形式返回。HTMLCollection 是一个类数组对象,它类似于数组,但并不是数组,它只包含元素节点(Element Node)。

如何使用 getElementsByTagName() 方法

要使用 getElementsByTagName() 方法,我们首先需要获取到需要操作的元素,可以通过 document 对象来获取整个文档,也可以通过其他元素的引用来获取其子元素。然后调用该元素的 getElementsByTagName() 方法并传入标签名称作为参数即可。

示例代码

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

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

在上面的示例代码中,我们通过 document.getElementsByTagName('li') 获取到了文档中所有的 <li> 元素,并使用 for 循环遍历输出了每个 <li> 元素的文本内容。

注意事项

  • getElementsByTagName() 方法返回的是一个 HTMLCollection 类数组对象,可以通过下标访问其中的元素。
  • getElementsByTagName() 方法会获取到文档中所有指定标签的元素,包括嵌套在其他元素中的。
  • 如果要获取到指定元素的子元素中的标签,可以先获取到父元素,再调用其 getElementsByTagName() 方法。

通过本文的介绍,相信大家对 HTML DOM 中的 getElementsByTagName() 方法有了更深入的了解。希望这篇文章对你有所帮助,能够在日常的前端开发工作中更加熟练地使用这个方法。

纠错
反馈