空父DIV，但不子div

Question

我有兩個div，一個在另一個中：

<DIV id="DIV_1">
    parent_contents
    parent_contents

     <DIV id="DIV_2">
         child_contents
         child_contents
     </DIV>
</DIV>

我要刪除parent_contents，但不刪除child_contents。 當我做：

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

我丟掉了孩子的東西...

Answer 1

過濾掉textnode並將其刪除：

$('#DIV_1').contents().filter(function() {
    return this.nodeType === 3;
}).remove();

小提琴

或只留下#DIV_2 ，僅過濾出一個元素：

$('#DIV_1').contents().filter(function() {
    return this.id != 'DIV_2';
}).remove();

小提琴

Answer 2

我敢肯定，最簡單的方法之一是將DIV_2子內容復制到變量中，然后在清空后將其附加到DIV_1上。

jsFiddle演示

var $temp = $('#DIV_2');
$("#DIV_1").empty().append($temp);