zoukankan      html  css  js  c++  java
  • appendChild()插入节点需注意的问题

    第一点:首先appendChild插入节点时返回的值是插入的节点本身,另外必须要找到所要插入的父节点:

    1 var returnNode = parentNode.appendChild(childNode);
    2 console.log(returnNote===childNode);//true

    第二点:appendChild所要插入的新节点如果存在于文档流中,那么此时并不会把心节点复制然后插入到这个父节点下,而是把这个新节点从源文档流中移动到所要插入的父节点下:

     1 <div id="test">
     2     <div>adscasdjk</div>
     3     <div id="a">adscasdjk</div>
     4 </div>
     5 <script type="text/javascript">
     6     var t = document.getElementById("test");
     7     var a = document.getElementById('a');
     8     //var tt = a.cloneNode(true);
     9     t.appendChild(a);
    10 </script>

    这样有js代码和没有js代码的表现是一样的,但是在fireBug下可以清楚地发现有id的div移动到了没有id的那个div前面去了;也即是id='a'的div只是移动到了父节点下而已。

     1 <div id="test">
     2     <div>adscasdjk</div>
     3     <div id="a">adscasdjk</div>
     4 </div>
     5 <script type="text/javascript">
     6     var t = document.getElementById("test");
     7     var a = document.getElementById('a');
     8     var tt = a.cloneNode(true);
     9     t.appendChild(tt);
    10 </script>

    解决的方法就是将所要插入的节点clone一下在插入到相应位置,这样就可以达到预期的效果了

  • 相关阅读:
    android高级UI之Paint Xfermode
    android高级UI之Paint滤镜
    常见文献管理软件
    linux下10款markdown软件
    markdown页面内跳转
    Ubuntu18.04配制阿里巴巴的源
    python中TAB补全
    word中手动添加endnote的加载项
    MarkDown添加图片的三种方式
    word前页与后页页码断开
  • 原文地址:https://www.cnblogs.com/cdwp8/p/4213856.html
Copyright © 2011-2022 走看看