Javascript 从DOM中删除元素

我使用此方法在客户端转义HTML代码字符串：

function escapeHTML(str)
{
   var div = document.createElement('div');
   var text = document.createTextNode(str);
   div.appendChild(text);
   return div.innerHTML;
}; 

我有点担心内存泄漏，因为我正在创建DOM元素，而不是销毁它。该页面大量使用Ajax，很少刷新，因此可能会有数百次调用该方法而不重新加载页面，这意味着这些对象将堆积起来，降低DOM traveral的速度（例如使用jQuery）

我试图使用

document.removeChild（div）

，但IE给出了一个错误“htmlfile:Invalid argument”

有什么想法吗

谢谢，

---

Andrey

IIRC你不必在意，因为JS是垃圾收集的。如果这是一个巨大的问题，您可以尝试在很短的时间间隔内通过

setTimeout（）

调用块进行解析。

如果您加载了jQuery，您可以使用。

DOM:

var node = document.getElementById('node_to_delete');
node.parentNode.removeChild(node);

jQuery：

$('#node_to_delete').remove();

---

您需要对元素本身调用

removeChild

：

function escapeHTML(str) {
   var div = document.createElement('div');
   var text = document.createTextNode(str);
   div.appendChild(text);
   var escapedHTML = div.innerHTML;
   div.removeChild(text);
   return escapedHTML;
}

需要记住的一点是，此解决方案在某些浏览器中有一些怪癖（例如处理换行符=“\n”）。在Prototype.js中，我们可以适当地修改和调整逻辑

当然，不用说，您应该使用功能检测，而不是浏览器嗅探；）

您也不需要每次调用函数时都创建新元素。只需将其存储在一个封闭的容器中。例如：

var escapeHTML = (function(){

  var div = document.createElement('div');
  var text = document.createTextNode('');

  div.appendChild(text);

  return function(str) {
    text.data = str;
    return div.innerHTML;
  };
})();

如果您采用这种方法并永久保留元素，您还可以考虑在页面卸载时清理它（即

null

ing），以防止可能的泄漏

不幸的是，在许多浏览器中，仅仅注册卸载事件处理程序就阻止了快速导航（又称页面缓存）。大多数JS库已经观察到该事件以进行清理，因此如果您正在使用一个（例如Prototype.JS、jQuery、YUI），您不必担心，页面缓存将被禁用

否则，您可能需要重新考虑您的选项，或者始终在运行时创建元素，或者完全采用不同的解决方案（例如，

String.prototype.replace

）：

函数escapeHTML（str）{
返回str.replace（//&g'，&；'）。replace（//g'，）；
}

---

哦，最后，您不需要在函数声明之后放置“；”；函数表达式建议以分号结尾：）

我应该补充一点，因为您的div从未添加到document元素中，它从来都不是文档DOM的一部分。这是我很久以来看到的最好的答案之一！超越一切。回答得好，回答得好。关于最后一段：讽刺的是，你在一个函数表达式后面漏掉了一个分号：）@Tim Down Ha！是的，真是讽刺。我会修好的。这就是为什么代码检查很重要：）我肯定这是我没有正确理解DOM，但我不理解您的第一个示例。创建了两个对象（一个元素和一个textnode），但只删除其中一个。如果有问题的话，肯定还有问题。然而，一开始就存在问题吗？正在创建对象，然后将其指定给局部变量。当函数退出且局部变量超出范围时，该对象不会被垃圾收集吗？很长一段时间以来，我都没有考虑堆叠和堆的问题，所以请原谅我有点生疏！

function escapeHTML(str) {
  return str.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;');
}