jQuery

jQueryで親要素を削除する方法(unwrap)

本記事では、jQueryで親要素を削除することができるunwrapメソッドの使い方について詳しく解説しています。

ITエンジニア特化の転職サイト!
自社内開発求人に強い【クラウドリンク】

先輩くん
先輩くん
年収、休日数、労働環境等クラウドリンクが審査し、これらを通過した優良求人情報のみ紹介しているよ!
後輩ちゃん
後輩ちゃん
100%自社内開発の求人だから、SESのように職場環境が変わらないのがいいね!
簡単30秒で無料登録!

jQueryの学習におすすめ参考書
jQuery最高の教科書

本書情報
著者株式会社シフトブレイン
発売日2013/11/26
ページ数320ページ
Kindle版
レビュー
(Amazon)
(93件)

親要素を削除する

親要素を削除する場合、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削除メソッド一覧

jQuery 要素削除一覧
unwrap親要素の削除
remove対象要素の削除
empty子要素の削除
detachデータやイベント情報を残したまま対象要素の削除

ブログランキング・にほんブログ村へ PVアクセスランキング にほんブログ村