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

编程知识 行业动态 更新时间:2024-06-13 00:19:46

通过document.getElementsByClassName("s1");或document.getElementsByName("s1")返回的是一个集合myCollection ,这是需要遍历某个元素下子元素的方法。(由于水平有限,所写的都是直接可运行的demo)

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob)</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() 。

更多推荐

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

本文发布于:2023-03-28 19:38:00,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/86830be9f21fbcdebe47c0ef469b9cf1.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:元素   遍历   HTML

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!