jquery - jQueryは、親div内の2セットの数値の前後にスパンを追加します

Question

この html へのバックエンド アクセスがないため、JavaScript が唯一の選択肢です。

.before() および .after() 関数を使用してみましたが、最初の電話番号の前と最後の電話番号の後にしか取得できません。

以下はその外観です。

<div id="phonenumber">888-888-888 888-888-8888</div>

これが私が達成しようとしていることです。

<div id="phonenumber">
<span>888-888-888</span> 
<span>888-888-8888</span>
</div>

Answer 1

このような？

$('#phonenumber').html(function(_, html){ //Use html callback function
    return $.map(html.split(/\s+/), function(val){ // split the current text based on spaces and use $.map to get the html span.
        return $('<span/>',{text:val}); //construct the span.
    });
});

デモ

これは出力です：

<div id="phonenumber">
      <span>888-888-888</span>
      <span>888-888-8888</span>
</div>