jqueryで要素オブジェクトを削除する方法-フロントエンドQ&A-php.cn

jqueryで要素オブジェクトを削除する方法

WBOY

リリース： 2022-06-17 19:39:22

オリジナル

2766 人が閲覧しました

要素オブジェクトを削除する Jquery メソッド: 1. "$(selector)" を使用して、指定された要素の要素オブジェクトを取得します; 2. 取得した要素を削除するには、remove() メソッドまたは detach() メソッドを使用します。はい、構文は「element object.remove()」および「element object.detach()」です。

jqueryで要素オブジェクトを削除する方法

このチュートリアルの動作環境: Windows10 システム、jquery3.6.0 バージョン、Dell G3 コンピューター。

jquery で要素オブジェクトを削除する方法

1. 指定した要素の要素オブジェクトを取得します

構文は次のとおりです。 ##

$(selector)

ログイン後にコピー

2. 要素オブジェクトの削除

(1) Remove() メソッドは、すべてのテキストおよび子ノードを含む、選択された要素を削除します。

このメソッドは、選択した要素のデータとイベントも削除します。

構文は次のとおりです:

$(selector).remove()

ログイン後にコピー

(2) detach() メソッドは、すべてのテキストおよび子ノードを含む、選択された要素を削除します。その後、データとイベントを永続化します。

このメソッドは、削除された要素のコピーを保持し、後で再挿入できるようにします。

構文は次のとおりです:

$(selector).detach()

ログイン後にコピー

例は次のとおりです:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$(".bt1").click(function(){
$(".p1").remove();
});
$(".bt2").click(function(){
$(".p2").detach();
});
});
</script>
</head>
<body>
<p class="p1">这是一个段落。</p>
<p class="p2">这是另一个段落。</p>
<button class="bt1">remove移除P元素</button>
<button class="bt2">detach移除P元素</button>
</body>
</html>

ログイン後にコピー

出力結果:

jqueryで要素オブジェクトを削除する方法 # #ビデオチュートリアルの推奨事項：