Javascript中创建元素的三种方式以及区别

所属分类：Web前端

摘要

1. innerHTML() 创建元素2. createElement() 创建元素3. document.wright() 创建元素

1. innerHTML() 创建元素

是将内容写入某个DOM节点中，单个创建元素没有什么影响，如果利用for循环拼接多个字符串的形式创建元素的话会出现执行时间的不一样，导致效率很慢；如果想要创建多个元素的效率更高可以不用拼接字符串，而是采取数组形式拼接，但是这种方式结构稍微复杂了点，不会导致页面的全部重绘。

2. createElement() 创建元素

这个是创建了新的元素，创建多个元素效率较低但是结构更清晰，也不会导致页面的全部重绘。

不同浏览器下，常用的innerHTML() 创建元素比常用的createElement() 创建元素效率高。

3. document.wright() 创建元素

是直接将内容写入页面的内容流，所以当页面文档流加载完毕，再调用会导致页面重绘。