master

分支 (1)

管理

管理

master

js
/
test18.html

<!DOCTYPE html>
<html>
    <head>
        <title>18Javascript HTML DOM Collection和NodeLIst对象</title>
        <meta charset="UTf-8">
    </head>
    <body>
        <h1>18Javascript HTML DOM Collection和NodeLIst对象</h1>
        <p>  hello world!</p>
        <p>  hello YuegiTech!</p>
        <p id = "demo"></p>
        <p id = "demo2"></p>
        <p id = "demo3"></p>
        <p id = "demo4"></p>
        <script>
            //使用getElementsByTagName()来获取相关元素的集合
            var myCollection = document.getElementsByTagName("p");
            document.getElementById("demo").innerHTML = "第2段的内容是:" + myCollection[1].innerHTML;
            //collection对象的length属性
            document.getElementById("demo2").innerHTML = "文档中共有" + myCollection.length + "个p元素";
            //使用querySelectorAll()方法 获取节点集合
            var myNodeLIst = document.querySelectorAll("p");
            document.getElementById("demo3").innerHTML = "第一段的内容是：" + myNodeLIst[0].innerHTML;
            //NodeList的length属性
            document.getElementById("demo4").innerHTML = "文档中共有" +myNodeLIst.length + "个p的节点";
        </script>
    </body>
</html>