使用 jQuery ，我可以$(sel).html(html)用来生成一个 html 区域。
如果没有 jquery ，我也可以做同样的事情，但dom.innerHTML = html;
我也发现$(sel).html()它比 慢dom.innerHTML，但为什么呢？
$(sel).html和 和有什么区别dom.innerHTML？
使用dom.innerHTML替换安全$(sel).html吗？
问问题
906 次
3 回答
10
设置 HTML.html()提供了一些适当的内务处理，以防止在使用其他 jQuery 功能时发生内存泄漏，然后再设置.innerHTML.
例如，如果您.data()在一个元素上使用并且您指定.innerHTML了您在其上使用的对象的父级.data()，那么.html()将清理.data()与要替换的元素关联的元素。如果您使用.innerHTML，这些.data()元素将被孤立，并且在您离开页面之前永远不会被清理（短期内存泄漏）。与已删除对象上的事件处理程序相关联的一些 jQuery 数据也是如此。
在 jQuery 中编程最安全的方法是在删除使用 jQuery 的元素时使用.remove()and （或其他类似的 jQuery 函数）而不是原生 DOM 函数。.html()
.html()可能会更慢，因为它做得更多（如果使用其他 jQuery 功能，其中一些是有利的）。
实际上，如果.innerHTML直接在使用其他 jQuery 功能的元素的父元素上使用可能发生的内存泄漏通常不是问题。它们可能有意义的地方是，如果您有与元素关联的大型数据结构（例如 in .data()），或者您创建和销毁大量元素，或者您打算让您的页面运行很长时间（例如单页应用程序）。因此，如果您想安全起见，请坚持使用 jQuery 方法来处理任何可以删除或替换元素的内容。
这是一个简单的内存泄漏示例：
<div id="container"><span id="whatever">foo</span></div>
$("#whatever").data("somedata", "really long string");
document.getElementById("container").innerHTML = "<span>new text</span>";
这会导致第一行代码中的信息集泄漏，.data()因为 jQuery 从来没有机会清理与现在已从 DOM 中删除的 #whatever 对象关联的数据，但 jQuery 从未看到您将其删除。
然而，这不会以这种方式泄漏：
<div id="container"><span id="whatever">foo</span></div>
$("#whatever").data("somedata", "really long string");
$("#container").html("<span>new text</span>");
于 2012-12-27T08:19:31.333 回答
3
jQuery.innerHTML在后台使用，所以如果你已经有一个 DOM 元素，并且你不需要提供额外的功能，.html()那么你可以安全地.innerHTML直接使用。
于 2012-12-27T08:18:31.360 回答
3
正如 Jquery Docs 所说.html()
此方法使用浏览器的 innerHTML 属性。某些浏览器可能不会返回与原始文档中的 HTML 源完全相同的 HTML。例如，如果属性值仅包含字母数字字符，Internet Explorer 有时会省略属性值的引号。
我认为它只是变得更慢，因为 .html() 是更大的 Jquery 库的一部分，它可以让你做更多的事情。但是在这两种方法之间使用 . 没关系innerHTML()_Jquery.html()
于 2012-12-27T08:19:01.700 回答