在IE中从DOM中删除子元素的最快方法是什么？

Question

我正在使用jQuery，并且有一个包含几百行的表元素。我想删除所有行，然后添加一组新行。我这样做是通过调用remove然后追加父元素。

我的附加逻辑相当快，并遵循此处给出的建议：http://www.learningjquery.com/2009/03/43439-reasons-to-use-append-correctly

但是，删除单次调用所需的时间是追加的5倍。清除dom元素子元素的最快方法是什么？

编辑：这是我使用的代码的精简版本：

var table = $('#mytable');
$('tbody', table).remove();
table.append(tBodyContents.join(''));

tBodyContents是一个字符串数组，组合后将形成tbody中行的html。

Answer 1

我经常做

$('#myTableToEmpty').html('');

然后在需要的地方重新添加行。

Answer 2

function emptyElement(element){
  var i = element.childNodes.length;
  while(i--){
    element.removeChild(element.lastChild);
  }
}

这个实际上比innerHTML技巧更快，可以更快，取决于您的浏览器。 jsperf上有一些使用类似函数的测试，可以为你提供一些基准......

Answer 3

$('#tableId').empty()怎么样？

Documentation for empty method

Answer 4

如果速度确实非常重要，那么你最好使用innerHTML。 $（'tbody'，table）[0] .innerHTML ='';

我个人会完全忽略jQuery，给身体一个ID，然后去找document.getElementById（'id'）。innerHTML =''选项。并且offcourse仍然使用jQuery添加。

Answer 5

我确认innerHTML从单个元素中删除巨大的html要快得多。 就我而言：

$('#main').html('');  // --> approx 5-6 seconds

$('#main').innerHTML=''; // --> a few milliseconds

感谢您的提示