jquery - 如何将 CSS 类应用于拆分字符串

Question

我有一些使用 XSL 生成的 HTML 内容:

<span class="hrsDisp">Sunday: Closed</span>
<span class="hrsDisp">Monday &amp; Tuesday: 8 AM - 7 PM</span>
<span class="hrsDisp">Tuesday &amp; Wednesday: 7 AM - 7 PM</span>
<span class="hrsDisp">Mon, Wed, &amp; Fri: 7 AM - 5:30 PM</span>

XSL:

<span class="hrsDisp">
    <xsl:value-of select="txtHours" />
</span>

我正在尝试使用 JQuery 将 : 之前的文本设置为粗体。我有以下获取字符串但警报语句只显示一个警报，即使有多个条目也是如此:

$(function () {
    var theTime = $(".hrsDisp").text().split(":")[0];
    alert(theTime);
});

上面的代码没有按预期工作，但也没有抛出任何错误。我添加了以下行来添加类:

theTime.addClas("setBold");

我在控制台中收到 Uncaught Error 异常。

我认为可行的最终脚本是:

$(function () {
    var theTime = $(".hrsDisp").text().split(":")[0];
    alert(theTime);
    theTime.addClass("setBold");
});

相反，我的页面显示不正确，我在控制台中收到错误消息。

请帮我解决我的问题。

Answer 1

尝试以下 XSL 规则而不是 javascript 操作:

<span class="hrsDisp">
    <strong><xsl:value-of select="substring-before(txtHours, ':')" /></strong>:
    <xsl:value-of select="substring-after(txtHours, ':')" />
</span>

或者你可以这样使用 jQuery:

$(function () {
    $(".hrsDisp").html(function(i, old) {
        return '<strong>' + old.split(":").join('</strong>:');
    });    
});