其他分享
首页 > 其他分享> > HTML遍历某个元素下的子元素

HTML遍历某个元素下的子元素

作者:互联网

通过document.getElementsByClassName("s1");或document.getElementsByName("s1")返回的是一个集合myCollection ,这是需要遍历某个元素下子元素的方法。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>

<h2>JavaScript HTML DOM</h2>

<p class="s1">Hello World!</p>

<p class="s1">Hello Runoob!</p>

<p class="s1">点击按钮修改 p 元素的背景颜色。</p>

<button οnclick="myFunction()">点我</button>

<script>
function myFunction() {
    var myCollection = document.getElementsByClassName("s1");
    var i;
    for (i = 0; i < myCollection.length; i++) {
        myCollection[i].style.color = "red";
    }
}
</script>

</body>
</html>

 

注意

HTMLCollection 不是一个数组!

HTMLCollection 看起来可能是一个数组,但其实不是。

你可以像数组一样,使用索引来获取元素。

HTMLCollection 无法使用数组的方法: valueOf(), pop(), push(), 或 join() 。

标签:遍历,HTMLCollection,s1,元素,myCollection,HTML,数组,document
来源: https://blog.csdn.net/zhh0310235/article/details/98741687