jQuery.remove()関数の使い方の詳しい説明

remove() 関数は、ドキュメントから一致する要素を削除するために使用されます。

セレクターを使用して、削除の範囲をさらに絞り込み、指定したセレクターに一致する、現在一致している要素の一部のみを削除することもできます。

detach() と比較すると、remove() 関数は、要素にバインドされている追加データ (data() 関数) と イベント ハンドラーを同時に削除します (detach() はそれを保持します)。

この関数はjQueryオブジェクト(インスタンス)に属します。

構文

jQueryObject.remove( [ selector ] )

パラメータ

パラメータの説明

selector セレクタに一致する要素をフィルタリングするために使用される、オプション/文字列型Stringで指定されるセレクタ。

セレクターパラメーターが指定されていない場合、現在一致する要素内のすべての要素が削除されます。

戻り値

remove()関数の戻り値はjQuery型で、現在のjQueryオブジェクトそのものを返します。

例と説明

remove() 関数は、ドキュメントから一致する要素を削除するために使用されます:

段落テキスト 1item1line2

段落テキスト 2item2line2

段落テキスト 1

段落テキスト 2

次の HTML コードを例として取り上げます。

[span#n2]

[label#n4]

< p id=" n5">

段落内容

[span#n6][span#n7​​]< ;/span>

次の jQuery サンプル コードは、remove() 関数の具体的な使用法を示すために使用されます。 n6要素を削除

$n6 .remove( );

var $p = $("p");

// クラス名「mark」のp要素を削除

var $removedP = $p.remove ( ".mark" ) ; // $removedP === $p

// 削除された n6 を body 要素内の開始位置に追加します

// n6 は以前にドキュメントから削除されていますが

// not では jQuery オブジェクトから削除されないので、jQuery オブジェクトを使用して n6 をドキュメントに再度挿入することもできます

$n6.prependTo( "body" );

コードを実行します (他のコードを自分でデモにコピーしてください)ページ実行中)

上記のコードを実行した後の完全な HTML コードは次のとおりです (形式は調整されていません):

[span#n6][span#n7​​]

段落の内容

remove() 関数は削除しますドキュメント要素内の一致する段落は削除されませんが、jQuery オブジェクトから一致する要素は削除されません。ただし、remove() は要素自体を保持するだけで、要素に関連付けられたその他の追加データとバインディング イベントは削除されます

を参照してください。次の段落の HTML コード:

次に、すべてのボタンのクリック イベントを登録し、要素 n3 を削除し、削除した n3 を n1 に再度追加します。終了位置:

var $n3 = $("#n3");

$n3.data("myX", "追加データ");

document

.writeln( $n3.data("myX " ") ); // 追加データ

$n3.trigger("click"); // ポップアップ プロンプト ボックスの情報: ボタン 2

// 要素 n3 を削除します

$n3.remove();

// n3 を n1 の最後に再度追加します

$n3.appendTo("#n1");

// 現時点では、n3 の追加データとバインドされたクリック イベントは削除されています

document.writeln( $n3 .data("myX") ); // 未定義

$n3.trigger("click"); // イベント応答なし

クリックイベントがインライン属性として要素ノードに直接登録されている場合、remove( ) このフォームの登録済みイベントは削除できません:

onclick="alert('クリック イベントは削除できません'); />

以上がjQuery.remove()関数の使い方の詳しい説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。