3-2 DOM

1. DOM 是增删改查元素的标准

    DOM  document object model 文档对象类型 <br />        DOM树是由节点组成的 <br />        节点的关系：父子兄弟 

2.如何获取节点 通过id

    var app = document.getElementById("app");<br />        console.log(app);

<script>
<div id="app" class="one">hello</div>
    <div>good</div>
    <p class="one">world</p>
    <script>
        var app = document.getElementById("app");
        console.log(app);
    </script>

3. 如何获取节点 通过class名 tips：获取的是一个集合（类数组对象）

    var one = document.getElementsByClassName("one");<br />        console.log(one[0]);

<script>
<div id="app" class="one">hello</div>
    <div>good</div>
    <p class="one">world</p>
    <script>
        var one = document.getElementsByClassName("one");
        console.log(one[0]);
    </script>

4. 如何获取节点 通过标签名获取

    var s = document.getElementsByTagName("div");<br />        console.log(s[0])

<script>
<div id="app" class="one">hello</div>
    <div>good</div>
    <p class="one">world</p>
    <script>
        var s = document.getElementsByTagName("div");
        console.log(s[0])
    </script>

5. 如何获取节点 通过选择器去获取

    var divs = document.querySelectorAll("body #app");<br />        console.log(divs[0]);

    <style>
        #app{
            color: red;
        }
    </style>
<script>
<div id="app" class="one">hello</div>
    <div>good</div>
    <p class="one">world</p>
    <script>
        var divs = document.querySelectorAll("body #app");
        console.log(divs[0]);
    </script>