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

可运行下面的代码测试:

/p>

1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

new document

/>

/>

value="testInnerHTML">

value="testAppendChild">

2、如果appendChild的参数是页面存在的一个元素,则执行后原来的元素会被移除,如document.getElement("a").appendChild(document.getElementByIdx("b")),执行后,b元素会先被移除,然后再添加到a中。

3、通过appendChild添加到的是dom对象,返回的也是dom对象,可以通过dom对象访问获取元素的各种属性,而innerHTML则是纯字符串,不能获取内部元素的属性。

4、在使用上innerHTML比appendChild要方便,特别是创建的节点属性多,同时还包含文本的时候。

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

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐