最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
javascript innerHTML优化详解
时间：2011-08-20 编辑：简简单单 来源：一聚教程网
例子：我们要实现的效果是当用户点击鼠标的时候，就在旧数据上追加若干新数据。
如果使用标准DOM的话，完整代码如下：
复制代码 代码如下:
test
data
注：一旦结构比较复杂的话，标准DOM需要编写冗长的代码。
如果使用innerHTML的话，部分代码如下：
复制代码 代码如下:
注：innerHTML没有标准DOM中的appendChild，所以使用了『+=』的方式，效率低下。
我们可以结合使用innerHTML和标准DOM，这样二者的优点就兼得了，部分代码如下：
复制代码 代码如下:
注：创建一个元素，然后注入innerHTML，接着在元素上使用标准DOM操作。
还不算完，Asynchronous innerHTML给出了更强悍的解决方法，部分代码如下：
复制代码 代码如下:
注：使用setTimeout防止堵塞浏览器，使用DocumentFragment减少渲染次数。
相关文章
- HTML简单购物数量小程序代码展示 10-31
- html canvas实现弹幕功能 10-31
- HTML中空格表示的意义 10-31
- html area标签解读 10-31
- html使用表单标签实现注册页面代码展示 10-31
- 使用HTML截图并保存为本地图片的代码展示 10-31