要素のテキストを置き換えると子要素が消えてしまう。

Question

<div class="price">¥39,000の金額を置き換えたいのですが、 jQueryで以下の処理をすると、子要素の<em class="tax">（税込）</em> </div>までが消えてしまいます。

●やりたいこと

<div class="price">¥39,000 の「¥39,000」のみ置き換えるにはどのように書けばよいのでしょうか？

ご教授をお願いいたします。

元のhtml

<div class="price">
	¥39,000<em class="tax">（税込）</em>
</div>

書き換える処理

$('.price').text('これに置き換える');

Answer 1

価格もspanで囲ってidなりclassなり付けるのが良いかと。

Comments

[kakeshi]

ご回答誠にありがとうございました。
とても参考になりました。

Answer 2

Textノードのdataプロパティを書き換えればよいです。

let element = $('.price')[0];
element.normalize();
element.firstChild.data = 'これに置き換える';

Comments

[kakeshi]

ご回答誠にありがとうございました。
とても参考になりました。