jQueryにて指定した要素の親要素を削除する方法
jQueryにて指定した要素の親要素を削除したいケースがあった。通常の場合だと親要素のHTML部分を削除すれば良いがASPで出力されている部分だったためそのような方法が取られなかった。調べたところunwrap()を用いることで解決した。以下に利用方法等をメモ。
利用方法
ソースコード
<div id="parent_1"> <div id="parent_2"> <div id="child"></div> </div> </div> <script type="text/javascript" src="https://code.jquery.com/jquery-3.7.1.min.js"></script> <script type="text/javascript"> $(function(){ $(`#child`).unwrap(); }); </script>
結果
上記ソースコードの実行結果は以下の通り。
<div id="parent_1"> <div id="child"></div> </div>
注意点等
直近の親要素を削除するため#parent_2が削除され、#parent_1及び#childは残る。#parent_1も削除したい場合は「$(`#child`).unwrap().unwrap();」と2回指定する必要あり。
リファレンス
.unwrap()
関連記事
-
-
NicEdit(WYSIWYGエディタ)を再描写時にサイズを調整する方法
NicEdit(WYSIWYGエディタ)を設置しているサイトがあった。ページ読み ...
-
-
「slick」でスライダー中央の下部にのみ指定したコンテンツを表示する方法
「slick」でスライダー画像の下部に何らかのコンテンツ(テキスト・リンク・別画 ...
-
-
jQueryでUNIXタイムスタンプの取得
jQueryでUNIXタイムスタンプを取得したい場合、 $.now()だけで取得 ...
-
-
jQueryでiframe内の要素を呼び出し
jQueryでiframeで開いたbody内の内容が欲しかった。 ■jQuery ...
-
-
Dropzone.jsを使って画像をドラッグ&ドロップでアップロードする方法
画像を複数枚ドラッグ&ドロップでアップロードしたかった。だいぶ前にDro ...