jQuery を使用してノードを削除する 3 つの方法

テストに使用した HTML コード:

あなたの好きな果物は何ですか?

• アップル


• オレンジ


• パイナップル

1.remove()メソッド

$("ul li").click(function(){
alert($(this).html ()) ;
});
var $li = $("ul li:eq(1)").remove();
$li.appendTo("ul");

ノードがremove()メソッドを使用すると、すべてノードに含まれる子孫ノードも同時に削除されます。このメソッドの戻り値は削除されたノードへの参照であるため、要素は後で再度使用できます。

2. detach()メソッド

var $li = $("ul li:eq(1)").detach();
$li.appendTo("ul");

detach()とremove( )、一致するすべての要素が DOM から削除されます。ただし、このメソッドは jQuery オブジェクトから一致する要素を削除しないため、これらの一致する要素は将来再び使用できることに注意してください。 Remove() とは異なり、すべてのバインドされたイベントと追加データは保持されます。

3. empty()メソッド

var $li = $("ul li:eq(1)").empty();
$li.appendTo("ul");

厳密にはempty()このメソッドはノードを削除しませんが、要素内のすべての子孫ノードをクリアします。