Question

我正在使用jQuery 1.6.2。

在母版页中，我打开几个div，稍后将通过使用按钮填充信息：

<input type="button" id="ButtonOne">
<input type="button" id="ButtonTwo">
<input type="button" id="ButtonThree">
<div class="SectionDiv" id="DivOne"></div>
<div class="SectionDiv" id="DivTwo"></div>
<div class="SectionDiv" id="DivThree"></div>

我打电话来填充这样的div：

$("#ButtonOne").click(function() {
    $("#DivOne").load("FileOne.html");
});

当我填充div时，我想摆脱其他div中的所有内容。我做了两种不同的方式。像这样：

// METHOD ONE
$("#ButtonOne").click(function() {
    // UNLOAD ALL DIVS
    $(".SectionDiv").load("BlankPage.html");
    // LOAD THE DIV THAT NEEDS TO BE LOADED
    $("#DivOne").load("FileOne.html");
});

// METHOD TWO
$("#ButtonOne").click(function() {
    // UNLOAD ALL DIVS
    $(".SectionDiv").html("");
    // LOAD THE DIV THAT NEEDS TO BE LOADED
    $("#DivOne").load("FileOne.html");
});

在方法一中，我使用没有内容的页面加载div，这是一个完全空白的页面。在方法二中，我使用html（＆＃34;＆＃34;）具有相同的效果（？）。

虽然这两种方法具有相同的视觉效果，但是为了杀死div中的现有变量，或者更好地从DOM中删除元素，还是其他任何一种方法，它们是否具有明显的优势？在某些环境中比其他环境更快吗？一个人比另一个人占用更多的资源吗？

Answer 1

方法一导致请求无缘无故地获取空白页面（因为您知道它是空白的，不需要请求）。因此，方法二基本上是方法一的优化版本，因为它节省了无用的额外HTTP请求。

Answer 2

$(".SectionDiv").each(function(index, ele){
ele.html("");
});

尝试上述操作，因为有多个.SectionDiv元素，您必须为每个元素循环。

如何使用LOAD或HTML来管理资源，从而最好地卸载DIV中的内容？

2 个答案: