Làm cách nào để xóa tất cả nội dung <div> s 'bên trong cha mẹ <div>?

Tôi có một div <div id="masterdiv">có vài con <div>.

Thí dụ:

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

Làm cách nào để xóa nội dung của tất cả các con <div>bên trong bản gốc <div>bằng jQuery?

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

empty()Hàm của jQuery thực hiện điều đó:

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

dọn dẹp chủ div.

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

xóa tất cả các con div, nhưng giữ nguyên chủ.

Sử dụng cú pháp bộ chọn CSS của jQuery để chọn tất cả các divphần tử bên trong phần tử có id masterdiv. Sau đó gọi empty()để xóa nội dung.

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

Việc sử dụng text('')hoặc html('')sẽ khiến một số phân tích chuỗi diễn ra, thường là một ý tưởng tồi khi làm việc với DOM. Hãy thử và sử dụng các phương thức thao tác DOM không liên quan đến biểu diễn chuỗi của các đối tượng DOM bất cứ khi nào có thể.

jQuery khuyên bạn nên sử dụng ".empty ()", ". remove ()", ". Detach ()"

nếu bạn cần xóa tất cả phần tử trong phần tử, hãy sử dụng mã này:

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

nếu bạn cần xóa tất cả phần tử, hãy sử dụng mã này:

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

i và nhóm jQuery không khuyến nghị sử dụng SET FUNCTION như .html () .attr () .text (), đó là gì? đó là nếu bạn muốn thiết lập bất cứ điều gì bạn cần

ref: https://learn.jquery.com/USE-jquery-core/manipulation-elements/

Nếu tất cả các div bên trong masterdiv cần phải bị xóa, thì đây là.

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

khác, bạn cần lặp lại trên tất cả các con div của #masterdiv và kiểm tra xem id có bắt đầu bằng childdiv không.

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

Cách tốt hơn là:

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

$("#masterdiv div").text("");

$("#masterdiv > *").text("")

hoặc là

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

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

hoặc là

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

Hoạt động tốt để xóa nội dung bên trong div

Bạn có thể sử dụng hàm .empty () để xóa tất cả các phần tử con

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

Để xem so sánh giữa jquery .empty (),. Leather (), .remove () và .detach () theo dõi tại đây http://www.voidtricks.com/jquery-empty- leather-remove-detach /

Khi bạn đang nối thêm dữ liệu vào div bằng id bằng bất kỳ dịch vụ hoặc cơ sở dữ liệu nào, trước tiên hãy thử dữ liệu trống, như thế này:

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

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

hoặc là

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

Tôi biết đây là một jQuerycâu hỏi liên quan, nhưng tôi tin rằng ai đó có thể đến đây mong đợi một Javascriptgiải pháp thuần túy . Vì vậy, nếu bạn đang cố gắng thực hiện việc này bằng cách sử dụng js, bạn có thể sử dụng thuộc innerHTMLtính và đặt nó thành một chuỗi trống.

document.getElementById('masterdiv').innerHTML = '';

Hãy thử chúng nếu nó giúp.

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

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