HTML中appendChild和innerHTML的区别

1、在执行速度的比较上,使用appendChild比innerHTML要快,特别是内容包括html标记时,appendChild明显要快于innerHTML,这可能是因为innerHTML在铺到页面之前还要对内容进行解析才能铺到页面上,当包含html标记过多时,innerHTML速度会明显变慢。
可运行下面的代码测试:




   new document
  
  
  
  





  


2、如果appendChild的参数是页面存在的一个元素,则执行后原来的元素会被移除,如document.getElement("a").appendChild(document.getElementByIdx("b")),执行后,b元素会先被移除,然后再添加到a中。
3、通过appendChild添加到的是dom对象,返回的也是dom对象,可以通过dom对象访问获取元素的各种属性,而innerHTML则是纯字符串,不能获取内部元素的属性。
4、在使用上innerHTML比appendChild要方便,特别是创建的节点属性多,同时还包含文本的时候。

因此在使用时如果数据量较大且对性能有所要求时,还是应该使用appendChild。

5.IE6-9中innerHtml部分元素只读:The innerHTML property is read-only on the colcolGroupframeSethtmlheadstyletabletBodytFoottHeadtitle, and tr objects.

6.用appendChild加入

你可能感兴趣的:(web)