最近ではレスポンシブ対応などでの構成を考える上で 要素によって、PC版ではリンクさせるけれど、スマホ版ではリンクさせない、といった HTMLソース上では<a>タグをつける必要があっても それを無効化する必要があることによく遭遇します。 そんな時に使える、jQueryで親要素を削除することができる 「unwrap()」が便利だったのでご紹介。 サンプルでは、リンクテキストを用意して、 PCでは通常にリンクが張られ、スマホ(iPhone/iPod、Android)では テキスト表示のみになる、といったものを紹介してみます。 HTML側ではリンク<a>タグの中に <span>タグで囲ったテキストを入れます。 ◆HTML <a href="https://black-flag.net" target="_blank" rel="noopener"><span>リンクテキスト</span></a>
![jQueryで親要素を削除する「unwrap()」|BLACKFLAG](https://cdn-ak-scissors.b.st-hatena.com/image/square/c662e9771e0c7ac0df846a4838fb1480f378049f/height=288;version=1;width=512/https%3A%2F%2Fblack-flag.net%2Fcommon%2Fimg%2Fogp_jquery.png%3F20231001)