【jquery】文字列の特定の文字をHTMLタグで囲む方法(修正版)

前回文字列の中から特定の文字を探してspanタグで囲む備忘録を書いたんだけどslice()を使って書くよりreplace()を使ったほうが早かったので書き直しの備忘録

特定の文字をreplace()を使ってHTMLタグで囲む方法

<p>これはテストです</p>

<script>
jQuery(function($){
	const elem = $('p');
	const elemTxt = elem.html();// 対象の文字列を取得
	const replaceTxt = elemTxt.replace(/テスト/g,'<span style="font-size:30px">テスト</span>');
	elem.html(replaceTxt);// 差し替え
});
</script>

複数の要素の中の特定の文字をreplace()を使ってHTMLタグで囲む方法

<p>これはテストです</p>
<p>テストですこれは</p>
<p>ですこれはテスト</p>

<script>
jQuery(function($){
	$('p').each(function(i) {
		const elem = $(this);
		const elemTxt = elem.html();// 対象の文字列を取得
		const replaceTxt = elemTxt.replace(/テスト/g,'<span style="font-size:30px">テスト</span>');
		elem.html(replaceTxt);// 差し替え
	});
});
</script>

前回、slice()を使って一度分割してHTMLタグを挟んで再結合してたけどreplace()を使ったほうが早かった…