javascript - 使用 JQuery 在逗号后将 span 插入 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。