解析js原生方法创建表格效率测试

我们先看一下三种算法以及在各种浏览器下的表现。
第一种： 直接操作dom。
复制代码 代码如下:
"http://www.w3.org/TR/html4/loose.dtd">

   
       
       
   
   
   
   


第二种，借助借助createdocumentFragment。
复制代码 代码如下:
"http://www.w3.org/TR/html4/loose.dtd">

   
       
       
   
   
   
   


第三种：借助js的原生表格操作方法
复制代码 代码如下:
"http://www.w3.org/TR/html4/loose.dtd">






   



以上可以看出用原生的js创建表格效率最好，借助createdocumentFragment优势不是很大（并不像网上说的那么明显），借助insertRow和insertCell等在ie6、7下效率太低，不建议使用。

对第一种算法简单的优化了一下：
复制代码 代码如下:
"http://www.w3.org/TR/html4/loose.dtd">

   
       
       
   
   
   
   


总结：对dom操作尽量使用createElement和appendChild，对于js内核提供的一些特殊方法慎用。