Gracecode网上的文章，好象研究了比较深。
本文的亮点写在了内容中，但我觉得argements.callee这个用法还是很有特色的。以前都是用this之类的来解决。。。
还有一个亮点就是document.Fragment这个东西。。。
不废话看原文：
异步 innerHTML
innerHTML 插入节点的性能的问题，通常是我们最关注的。在回答这问题时，James Padolsey 给出了他的解决方案，看到上述代码不仅赞叹了下：
JavaScript代码
- function asyncInnerHTML(HTML, callback) {
- var temp = document.createElement('div'),
- frag = document.createDocumentFragment();
- temp.innerHTML = HTML;
- (function(){
- if(temp.firstChild) {
- frag.appendChild(temp.firstChild);
- setTimeout(arguments.callee, 0);
- } else {
- callback(frag);
- }
- })();
- }
- 充分利用闭包解决 IE6 的内存溢出问题
- 使用延时 0 将操作从队列中拉出，防止浏览器假死
- Document Fragment 给予我们个相当好的沙盘，只是我们经常忘记了它
- 回调的节点可以使用 DOM 标准的手法（appendChild）插入
了解了参数就很容易调用，例如
JavaScript代码
- var htmlStr = '<div><p>...</p><p>...</p><div><div>...</div>';
- asyncInnerHTML(htmlStr, function(fragment){
- document.body.appendChild(fragment);
- });
再次不禁赞叹下！
组织 innerHTML 字符串
说到 innerHTML ，通常在这操作之前会有大部分的字符串操作用于连接节点。考虑下面的三种做法，有何不同
方式一
JavaScript代码
- var arr = ['item 1', 'item 2', 'item 3', ...];
- for (var i = 0, l = arr.length, list = ''; i < l; i++) {
- list += '<li>' + arr[i] + '</li>';
- }
- list = '<ul>' + list + '</ul>';
方式二
JavaScript代码
- var arr = ['item 1', 'item 2', 'item 3', ...];
- for (var i = 0, l = arr.length, list = []; i < l; i++) {
- list[list.length] = '<li>' + arr[i] + '</li>';
- }
- list = '<ul>' + list.join('') + '</ul>';
JavaScript代码
- var arr = ['item 1', 'item 2', 'item 3', ...];
- for (var i = 0, l = arr.length, list = []; i < l; i++) {
- list[list.length] = '<li>' + arr[i] + '</li>';
- }
- list = '<ul>' + list.join('') + '</ul>';
方式三
JavaScript代码
- var arr = ['item 1', 'item 2', 'item 3', ...];
- var list = '<ul><li>' + arr.join('</li><li>') + '</li></ul>';
JavaScript代码
- var arr = ['item 1', 'item 2', 'item 3', ...];
- var list = '<ul><li>' + arr.join('</li><li>') + '</li></ul>';
详细的对比测试在这里（没错，还是 James Padolsey 那小子的 Blog）。同时，PPK 也整理了份有关 innerHTML 的速度测试报告。
IE 的陷阱
对于 IE，innerHTML 有个不大不小的陷阱（via），就是在 tbody 中插入 innerHTML 时，会报莫名的“未知的运行错误”。
#1