没有太多细节,我正在使用
javascript清理表内的空白.我需要删除大量的文本节点.对于IE9来说,这似乎是我脚本的瓶颈.
以下所有方法都可以完成这项工作,但它们会导致极大的减速.
- domNode.removeNode(true);
- domNode.nodeValue = "";
- domNode.parentNode.removeChild(domNode);
有没有办法进行批量删除或隐藏它们在dom等中的方法.只是更快的东西.
我也在textnodes上尝试了这个：
- domNode.innerHTML = '';
虽然它执行得很快,但文本节点似乎没有被它发送.
此外,我需要保留事件绑定,因此整个表上的.innerHTML替换看起来不是一个选项.虽然它的运行速度提高了约5倍.
更新：
建议解决方案的粗略基准：
- //around 480ms
- stripWhitespaceTextNodes(domNode);
- //around 640ms
- parent.removeChild(domNode);
- stripWhitespaceTextNodes(domNode);
- parent.insertBefore(domNode,nextNode);
- //around 700ms
- tables[i].style.visibility = 'hidden';
- stripWhitespaceTextNodes(domNode);
- tables[i].style.visibility = 'visible';
- //around 1140ms
- tables[i].style.display = 'none';
- stripWhitespaceTextNodes(domNode);
- tables[i].style.display = 'block';
这是在4个表上完成的,其中一个表有1500行.
stripWhitespaceTextNodes()函数的关键是删除文本节点,这似乎是瓶颈,这是我对它的各种尝试.
- domNode.parentNode.removeChild(domNode);
- domNode.removeNode(true);
- domNode.nodeValue = ""; // <-- CURRENTLY THIS ONE IS THE TOP RUNNER
- domNode.replaceWholeText('');
- domNode.deleteData(0,domNode.length);
- var txtNode = document.createTextNode("");
- domNode.parentNode.replaceChild(txtNode,domNode);
- parent.insertBefore(domNode,nextNode);
- //fast but doesn't work
- domNode.innerHTML = '';
解决方法
通常的做法是在进行大的更改之前从DOM中删除正在执行这些操作的容器,然后在完成后将其放回原处.
所以在你的情况下,那可能是：
- var table = /* ...get a reference to the table...*/;
- var nextNode = table.nextSibling; // May be null,that's fine
- var parent = table.parentNode;
- parent.removeChild(table);
- /* ...clean up the text nodes... */
- parent.insertBefore(table,nextNode);
即使树与页面的DOM分离,事件处理程序仍保持连接状态,因此当树被放回时它们将存在.
