jquery - スパンの親からスパンを取り出し、親にクラスを与えます

Question

I have this html:

<span class="titreck">
L
<span class="descck">Column 1</span>
</span>

タイトレック スパンに別のクラスを与える必要がありますが、その親タイトレック スパンからデスクック スパンを取り出す必要もあります。

このページには他のタイトレック スパンもあります。これにのみ影響を与える必要があります。

タイトレックのスパンを破壊するunwrapを使ってみたのですが、Lの文字が残ってしまうのが難点です。

最初に、親スパンに次のクラスを与えました。

$('span.descck').parent().addClass('hideme');

次に、アンラップを次のように使用します。

$('span.descck').unwrap();

しかし、L 文字は残ります。descck スパン内のコンテンツだけを残す必要があります。

Answer 1

has()method...を使用addClass()してクラスを追加し、そのテキストを置き換えtext()ます。descck クラスのテキストを使用します。

これを試して

$('span.titreck:has(".descck")').addClass('hideme').text($("span.descck").text());

Answer 2

このようなものが動作するはずです:

/*Change the class of the span having a class of titreck that is a parent of the span having a class of descck */
$("span.descck").parent(".titreck").addClass("newClass").removeClass("titreck");
/*Remove the span that has a class of descck*/
$("span.descck").remove();

Answer 3

このようにしてください：

var de = $('.descck').clone(); //<-----make a copy of this span
$('.descck').remove(); //<-------remove it 
de.insertAfter('.titreck'); //<---insert after its parent
$('.titreck').toggleClass('titreck newClass'); // <---toggle the class to new one

デモ