HTML DOM 元素 getElementsByTagName() 方法

语法

getElementsByTagName()方法的语法如下:

其中,tagName是要获取的元素的标签名称,可以是任何有效的 HTML 标签,比如divpa等。

返回值

getElementsByTagName()方法返回一个类数组对象,包含了所有指定标签名称的元素。如果没有找到匹配的元素,返回一个空的类数组对象。

示例

下面是一个简单的示例,演示了如何使用getElementsByTagName()方法获取页面中的所有<p>元素,并改变它们的文本颜色为红色:

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

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

在这个示例中,我们首先使用getElementsByTagName('p')方法获取了页面中所有的<p>元素,并将其保存在paragraphs变量中。然后,我们遍历这个类数组对象,将每个段萼的文本颜色改为红色。

注意事项

  • getElementsByTagName()方法返回的是一个动态的类数组对象,即使在调用方法后页面中新添加了符合条件的元素,它也会包含这些新元素。
  • 由于getElementsByTagName()方法返回的是类数组对象,如果需要对返回的元素集合进行数组操作,可以将其转换为真正的数组,比如使用Array.from()方法或Array.prototype.slice.call()方法。

通过本文的介绍,相信您已经了解了getElementsByTagName()方法的用法及示例。在实际开发中,结合其他 DOM 操作方法,您可以实现更加丰富和复杂的页面交互效果。祝您在 Web 前端开发的道路上越走越远!

纠错
反馈