本記事では、jQueryで親要素を削除することができるunwrapメソッドの使い方について詳しく解説しています。
ITエンジニア特化の転職サイト!
自社内開発求人に強い【クラウドリンク】
jQueryの学習におすすめ参考書
jQuery最高の教科書
Contents
親要素を削除する
親要素を削除する場合、unwrapメソッドを使います。
$("要素").unwrap();
親要素を削除するだけなので、引数などの指定はありません。
下記のサンプルコードでは、親要素に対してスタイルcolor:redを適用しています。テキストをクリックすると対象の親要素が削除されcolorがデフォルトの黒に変更します。
<p><span>テキスト1</span></p>
<p><span>テキスト2</span></p>
<p><span>テキスト3</span></p>
p{
color:red;
cursor:pointer;
}
$("span").on("click",function(){
$(this).unwrap();
});
jQuery削除メソッド一覧
unwrap | 親要素の削除 |
---|---|
remove | 対象要素の削除 |
empty | 子要素の削除 |
detach | データやイベント情報を残したまま対象要素の削除 |