• 第十章—DOM(0)—NODE类型


    DOM1定义了一个node接口,该接口由DOM的所有节点类型实现。

    所有的节点都存在这样或那样的关系。在HTML中,head,body可以看出是html的子元素,html是head,body的父元素,而head,body互为同胞元素。

    这里要注意一个概念:nodeList

    输出:

    如下例子:

     1 <div id="myDiv"> </div><!-- 此处有空格 -->
     2  <script>
     3     var div = document.getElementById('myDiv');
     4     var test = div.firstChild;
     5     if (test.nextSibling === null) {
     6         alert('good');//输出good
     7     }
     8     if (test.previousSibling === null) {
    9 alert('bad');//输出bad 10 }

     

    操作节点

    加入到文档中

     1     <style>
     2         #test {font-size: 20px;background: red;height: 100px;}
     3         #myDiv {color:red;}    
     4     </style>
     5 </head>
     6 <body>
     7   <ul id="test">
     8       <li>1</li><li>2</li><li>3</li>
     9   </ul>
    10  <script>
    11    var oul = document.getElementById('test');
    12    var deep = oul.cloneNode(true);
    13    alert(deep.childNodes.length);//7
    14    oul.parentNode.insertBefore(deep,oul);
    15    var shallow = oul.cloneNode(false);
    16    alert(shallow.childNodes.length);//0
    17    oul.parentNode.insertBefore(shallow,deep);
    18 
    19  </script>

    输出:

  • 相关阅读:
    绿色通道
    Banknotes
    旅行问题
    修剪草坪
    最大连续和
    动物园
    炮兵阵地
    涂抹果酱
    牧场的安排
    国王
  • 原文地址:https://www.cnblogs.com/xuzhudong/p/6582578.html
Copyright © 2020-2023  润新知