getElementsByClassName( )方法

getElementsByClassName( )方法可以返回带有相同类名的所有元素。

语法格式:

document.getElementsByClassName('类名称');

示例:

使用getElementsByClassName( )方法获取5个具有相同类名称的p元素。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>getElementsByClassName()方法</title>
</head>
<body>
    <p class="para">段落一</p>
    <p class="para">段落二</p>
    <p class="para">段落三</p>
    <p class="para">段落四</p>
    <p class="para">段落五</p>
    <script>
        var paras = document.getElementsByClassName('para'); 
        console.log(paras);
    </script>
</body>
</html>

控制台输出:

 

值得一提的是,HTMLCollection 对象类似于一个包含 HTML 元素的数组,我们可以通过索引来访问其中的元素(索引号从0开始)。


版权声明:本文为m0_57835615原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。