Jquery：如何在添加新内容之前清除元素？答案

【问题标题】：Jquery: How to clear an element before appending new content?Jquery：如何在添加新内容之前清除元素？
【发布时间】：2012-12-11 14:53:35
【问题描述】：

这是我的 jquery 代码

 $.ajax({
   url: "PopUpProductDetails.aspx",
            cache: false
     }).done(function (html) {
     $("#dialog").append(html);
 });

第一次，它工作得很好。它显示 PopUpProductDetails.aspx 页面的内容。但是，在那之后，如果我再次点击，我会得到两次相同的内容，依此类推。我认为问题在于我需要先清除 dialog 元素，然后再添加新内容。

我该怎么做？

【问题讨论】：

标签： jquery-ui

【解决方案1】：

.append() 将 html 附加到现有 html 字符串的末尾，使用 .html() 替换 #dialog 中的当前内容。

【讨论】：

注意：append() 不仅仅适用于包含 HTML 的字符串，而 .html() 仅适用于包含 HTML 的字符串。

【解决方案2】：

函数内部先清除对话框，再填充内容

$.ajax({
   url: "PopUpProductDetails.aspx",
            cache: false
     }).done(function (html) {
     $("#dialog").html("");
     $("#dialog").html(html);
 });

【讨论】：

很高兴答案对您有所帮助

【解决方案3】：

您可以先使用.empty()，然后在一行中使用.append() :)

像这样：

$.ajax({
  url: "PopUpProductDetails.aspx",
        cache: false
    }).done(function (html) {
    $("#dialog").empty().append(html);
});

【讨论】：

【解决方案4】：

如果您需要先清除对话框，请使用 .empty()，它比 .html("")

更快

见Jquery Difference .html("") vs .empty()

【讨论】：