使用jQuery删除附加的html？

Posted 2023-05-09

【中文标题】使用jQuery删除附加的html？

【英文标题】：Removing appended html using jQuery?

【发布时间】：2010-11-19 03:43:30

【问题描述】：

使用 jquery，我目前在单击事件上将 html 附加到 div。下面的代码允许我只淡入 div 的附加部分：

var html = "..";
$('<div></div>').appendTo("#id").hide().append(html).fadeIn('slow');

这部分效果很好。但是我以后怎样才能只删除（淡出）附加的部分？我尝试通过将 html prior 存储到附加内容来破解它，然后简单地隐藏所有内容并显示存储的 html。但是，当同一页面上的多个 div 重复使用相同的过程时，这不起作用（这似乎是糟糕的实现）。有什么好办法吗？

只是为了说明我为什么需要这个：想想一个博客类型的页面，页面上的每篇文章都有几个 cmets，默认情况下只显示 x 数量：click 事件获取剩余的 cmets 并显示它们，然后再次切换按钮会删除附加的 cmets 并将其发送回原始状态。

【参考方案1】：

empty() 始终是一个选项

jQuery('#main').empty();

【参考方案2】：

看看empty() 函数。

它可能会更好地解决问题。这是链接http://api.jquery.com/empty/

【参考方案3】：

我只是用 '.html()' 设置和清除 html ...

--编辑

为了更清楚，有一个专门用于添加这些 cmets 的区域：

<div id='commentarea1'></div>

等等

【讨论】：

我不关注...我需要将 html 附加到已经存在的 html 块中...然后仅删除已附加的部分

创建一个没有任何内容的div；在那里写下你的内容，然后将其清除（或真正隐藏）。

如此简单...不知道为什么我没有想到这样做...谢谢！

【参考方案4】：

试试：

var html = "..";
$('<div></div>').appendTo("#id").hide().append(html).fadeIn('slow').addClass('appended');

后来

$('#id .appended').fadeOut('slow'); // or whatever you want to do.

【参考方案5】：

问题不是很清楚，但说您默认显示 5 个 cmets，然后显示 x 多个 cmets。要恢复原来的 5 条评论默认状态，您可以删除索引大于 4（从零开始）的所有 cmets。

以下假设每个评论都位于其自己的具有类评论的 div 中。

$('#id>div.comment:gt(4)').remove();