如何清除所有 s’ contents inside a parent ?

问题描述 投票:207回答:13

我有一个div <div id="masterdiv">有几个孩子<div>s。

例:

<div id="masterdiv">
  <div id="childdiv1" />
  <div id="childdiv2" />
  <div id="childdiv3" />
</div>

如何使用jQuery清除主<div>中所有子<div>s的内容?

javascript jquery html dom-manipulation
13个回答
256
投票
jQuery('#masterdiv div').html('');

4
投票
$("#masterdiv div[id^='childdiv']").each(function(el){$(el).empty();});

要么

$("#masterdiv").find("div[id^='childdiv']").each(function(el){$(el).empty();});

4
投票
$('#div_id').empty();

要么

$('.div_class').empty();

工作正常删除div内的内容


4
投票

当您使用任何服务或数据库通过id将数据附加到div时,首先尝试将其空,如下所示:

var json = jsonParse(data.d);
$('#divname').empty();

-1
投票

尝试它们,如果它有帮助。

$('.div_parent .div_child').empty();

$('#div_parent #div_child').empty();


435
投票

jQuery empty()函数就是这样做的:

$('#masterdiv').empty();

清除主人div

$('#masterdiv div').empty();

清除所有孩子divs,但保持完整的主人。


19
投票

使用jQuery的CSS选择器语法选择id为div的元素内的所有masterdiv元素。然后调用empty()清除内容。

$('#masterdiv div').empty();

使用text('')html('')会导致一些字符串解析,这在处理DOM时通常是一个坏主意。尝试并使用DOM操作方法,尽可能不涉及DOM对象的字符串表示。


11
投票

如果masterdiv中的所有div都需要清除,那就这样吧。

$('#masterdiv div').html('');

否则,你需要迭代#masterdiv的所有div子项,并检查id是否以childdiv开头。

$('#masterdiv div').each(
    function(element){
        if(element.attr('id').substr(0, 8) == "childdiv")
        {
            element.html('');
        }
    }
 );

11
投票

更好的方法是:

 $( ".masterdiv" ).empty();

9
投票

jQuery建议您使用“.empty()”,“。remove()”,“。detach()”

如果您需要删除元素中的所有元素,请使用以下代码:

$('#target_id').empty();

如果您需要删除所有元素,请使用以下代码:

$('#target_id').remove();

我和jQuery组不建议使用像.html()。attr()。text()这样的SET FUNCTION,那是什么?如果你想要设置任何你需要的话

ref:https://learn.jquery.com/using-jquery-core/manipulating-elements/


6
投票

您可以使用.empty()函数清除所有子元素

 $(document).ready(function () {
  $("#button").click(function () {
   //only the content inside of the element will be deleted
   $("#masterdiv").empty();
  });
 });

要查看jquery .empty(),. hide(),. remove()和.detach()之间的比较,请点击此处http://www.voidtricks.com/jquery-empty-hide-remove-detach/


5
投票
$("#masterdiv > *").text("")

要么

$("#masterdiv").children().text("")

5
投票
$("#masterdiv div").text("");
© www.soinside.com 2019 - 2024. All rights reserved.