js中appendChild()方法

     appendChild(Node)这个方法一般是在指定元素节点的最后一个子节点之后添加节点,但如果Node是页面中的DOM对象,那么就不是添加节点了,就是直接Move节点。

     ① 创建原来没有的节点


	
  • 苹果
  • 香蕉
  • 橘子

    得到的结果:

        

     ② 添加的节点是页面中原有的DOM对象


	
  • 苹果
  • 香蕉
  • 橘子
  得到的结果

         

如果要添加的节点是网页中的DOM对象,这时直接用appendChild()方法会移动NODE节点,因此解决这种问题的办法是

      1.先使用cloneNode();克隆一下节点

      2.之后使用appendChild();


下面的代码是博主做的一个简易的显示界面,点击左边的小图标右边会显示大图。写这段代码的时候就遇到这个问题,因此把这个问题写下来希望自己下次能够细心一点也希望能帮助到有需要的人。

 




	
	图片显示
	


	
  • 图片1
  • 图片2
  • 图片3
  • 图片4
  • 图片5


        

你可能感兴趣的:(DOM;前端,javascript,javascript,appendchild添加节点)