javascript - JQueryを使用してカンマの後にスパンをdivに挿入します

Question

jQuery を使用してコンマの後にスパンを挿入できるようにしたいと考えています。次のようなdivがいくつかあります。

    <div class="title">Some text, with a comma.</div>
    <div class="title">Some text, with a comma.</div>
    <div class="title">Some text, with a comma.</div>
    <div class="title">Some text, with a comma.</div>
    <div class="title">Some text, with a comma.</div>
    <div class="title">Some text, with a comma.</div>

私はそれらをすべて次のように見せたいです:

<div class="title">Some text,<span class="something"> with a comma.</span></div>

コンマの後にテキストまたはhtmlを追加し、タイトルのクラスのみを対象とする方法はありますか?

Answer 1

$('.title').html(function(i, v){
    var html = v.split(',');
    return html[0] + ',' + '<span class="something">' + html[1] + '</span>'
});

http://jsfiddle.net/udjCs/2/

Answer 2

次のようなことができます。

$('div.title').each(function(){
    $(this).html( $(this).html().replace(',', ', <span class="something">') );
});

しかし、私はまだあなたが必要なものをよりよく説明する必要があると思います.

Answer 3

あなたの最善の策は、おそらく HTML 文字列を部分にスライスしてから、それを解析することです。

$(".title").html(function (index, html) {
    var commaIndex = html.indexOf(",");
    var beginningHtml = html.substring(0, commaIndex + 1);
    var endingHtml = html.substring(commaIndex + 1);
    return beginningHtml + "<span class=\"something\">" + endingHtml + "<\/span>";
});

これが私のコードのjsFiddleです。