ITTI STAFF
BLOG

イッティWEBスタッフの制作ブログ

テキストをspanタグでバラバラにするJavaScript

こんにちは。新人デザイナーのNNです。JavaScriptの小ネタです。

JavaScriptの小ネタ集です。今回はテキストをSPANタグでバラバラにするJSです。

下記のようにテキストをspanタグでバラバラにしたい時があります。

<div class="p_text">テキスト</div>
↓こうしたい
<div class="p_text">
<p>
<span>テ</span><span>キ</span><span>ス</span><span>ト</span>
</p>
</div>

spanタグでバラバラにするJS

JavaScriptは下記になります。

JavaScript
$('.p_text').html((i, html) => {
return '<p><span>' + $.trim(html).split('').join('</span><span>') + '</span></p>';
});

これでテキストをSPANタグでバラバラにできました。

新しい記事

新宿のWEB制作会社イッティ

新宿のWEB制作会社イッティ