Jquery $（sel）.html和dom.innerHTML之间的差异

使用jQuery，我可以使用

$（sel）.html（html）

生成html区域

没有jquery，我可以通过

dom.innerHTML=html做同样的事情

我还发现
$（sel）.html（）
比
dom.innerHTML
慢，但为什么呢

$（sel.html
和
dom.innerHTML
之间有什么区别？

使用
dom.innerHTML
替换
$（sel.html
）安全吗？
jQuery在引擎盖下使用
.innerHTML
，因此如果您已经有了dom元素，并且不需要
.html（）
提供的元素，那么您就可以直接安全地使用
.innerHTML
。
.html（）

此方法使用浏览器的innerHTML属性。有些浏览器可能会 不返回在原始文件中完全复制HTML源的HTML 文件。例如，Internet Explorer有时会关闭 如果属性值仅包含字母数字，则在属性值周围加引号 人物

我认为它只是变慢了，因为.html（）是一个更大的Jquery库的一部分，它可以让你做更多的事情。但是在这两种方法之间，使用.

innerHTML（）

和

Jquery.html（）

是可以的

---

使用

.HTML（）

设置HTML提供了一些适当的内务管理，以防止在设置

.innerHTML

之前使用其他jQuery功能时内存泄漏

例如，如果在元素上使用

.data（）

，并为使用

.data（）

的对象的父对象指定

.innerHTML

，则

.html（）

将清理与要替换的元素关联的

.data（）

元素。如果您使用

.innerHTML

，这些

.data（）

元素将成为孤立元素，在您离开页面之前，这些元素将永远不会被清除（短期内存泄漏）。与已删除对象上的事件处理程序关联的某些jQuery数据也是如此

在jQuery中编程最安全的方法是在删除使用过jQuery的元素时使用

.remove（）

和

.html（）

（或其他类似的jQuery函数）而不是本机DOM函数

.html（）

可能较慢，因为它做得更多（如果使用其他jQuery功能，其中一些功能是有利的）

实际上，如果直接在使用其他jQuery功能的元素的父元素上使用

.innerHTML

，则可能发生的内存泄漏通常不是问题。如果您有与元素相关联的大型数据结构（如

.data（）

），或者您创建并销毁了大量元素，或者您打算让页面运行很长时间（如单页应用程序），则这些元素可能会有意义。因此，如果您希望安全，那么对于任何可以删除或替换元素的内容，都可以使用jQuery方法

下面是一个简单内存泄漏的示例：

<div id="container"><span id="whatever">foo</span></div>

<div id="container"><span id="whatever">foo</span></div>

$（“#无论什么”）.data（“somedata”，“非常长的字符串”）；
$（“#容器”）.html（“新文本”）；

$（sel）.html（）

需要包括在内：）在中，搜索“html:function”。这些“额外功能”有助于防止由于使用其他jQuery功能（如

.data（）

或事件处理程序）而导致的内存泄漏。如果您使用的是其他jQuery功能，那么使用

.html（）

肯定更安全。

<div id="container"><span id="whatever">foo</span></div>

$("#whatever").data("somedata", "really long string");
$("#container").html("<span>new text</span>");