zoukankan      html  css  js  c++  java
  • JavaScript中childNodes、children、nodeValue、nodeType、parentNode、nextSibling详细讲解

       

    其中属性、元素(标签)、文本都属于节点

    <title></title>

       <scripttype="text/javascript">

           window.onload= function () {

               //找d1的所有子节点

               //1childNodes获取所有的子节点获取文本节点和元素节点

               vard1 = document.getElementById("d1");

                 for(i=0;i<=d1.length;i++)

               //alert(d1.childNodes[i].nodeName); //将会返回所有的文本节点和元素节点

               document.body.removeChild(d1);

               //           for (var i = 0; i< d1.childNodes.length; i++) {

               //               //节点 node

               //               //当时文本节点的时候

               //               if(d1.childNodes[i].nodeType == 3) {

               //                   alert(d1.childNodes[i].nodeValue);

               //               }

               //           }

               //d1.nodeValue//获取节点的值 只能获取文本节点的值

             //d1.nodeType //1 元素节点(标签) 2属性节点  3文本节点

               //children 获取子节点只获取元素节点 只有ie支持

               //           for (var i = 0; i< d1.children.length; i++) {

               //               alert(d1.children[i]);

               //           }

               //2parentNode父节点

               //element元素节点

               //node 所有类似的节点  文本属性 元素

               //           var d11 =document.getElementById("d11");

               //           var d = d11.parentNode;

               //           alert(d.id);

               //3兄弟节点     Sibling兄弟姐妹

               //nextSibling 下一个兄弟节点

               //           var d2 =document.getElementById("d2");

               //           var d =d2.nextSibling;

               //           alert(d.id);

               //           

               //           var dd =d2.previousSibling;//上一个兄弟节点

               //           alert(dd.id);

           }

       </script>

    </head>

    <body>

       <divid="d1">

        d1

           <!--123-->

           <divid="d11">d11

               <div>steee</div>

               <div>steee</div>

           </div>

           <divid="d12">d12</div>

           <divid="Div1">d13</div>

       </div>

       <divid="d2">

       d2<divid="d22"></div>

       </div>

       <divid="d3">

       d3<divid="d33"></div>

       </div>

    </body>

    </html>

  • 相关阅读:
    7-20 (样卷)统计单词的个数 (40 分)
    7-21 删除字符 (30 分)
    7-19 计算有n个字符串中最长的字符串长度 (40 分)
    7-16 列表数字元素加权和(1) (40 分)
    7-17 列表元素个数的加权和(1) (40 分)
    7-15 求出歌手的得分 (40 分)
    7-10 jmu-python-异常-学生成绩处理基本版 (15 分)
    7-11 jmu-python-分段函数&数学函数 (15 分)
    7-12 产生每位数字相同的n位数 (30 分)
    7-9 jmu-python-异常-学生成绩处理专业版 (25 分)
  • 原文地址:https://www.cnblogs.com/pangblog/p/3257828.html
Copyright © 2011-2022 走看看