如何在字符串中围绕“PM”和“AM”包装跨度？答案

【问题标题】：How to wrap a span around the ‘PM’ and ‘AM’ in a string?如何在字符串中围绕“PM”和“AM”包装跨度？
【发布时间】：2011-08-19 11:38:43
【问题描述】：

我想在时间字符串中围绕 AM 或 PM 包裹一个跨度。例如：

<span class="time">between 10:00AM and 14:00PM</span>

变成：

<span class="time">between 10:00<span class="suffix am">AM</span> and 14:00<span class="suffix pm">PM</span></span>

关于如何获取替换方法来执行此操作的任何线索？

【问题讨论】：

标签： javascript jquery regex time

【解决方案1】：

你能把am/pm 类名大写吗？在这种情况下，这将是一个解决方案：

$('.time').html(function(i, v) {
    return v.replace(/(AM|PM)/g, '<span class="suffix $1">$1</span>');
});

现场演示： http://jsfiddle.net/pVWh6/

【讨论】：

【解决方案2】：

我认为一个简单的 replace() 就可以做到：

$('.time').each(function() {
  var newMarkup = $(this).html().replace(/AM/g, '<span class="suffix am">AM</span>')
                                .replace(/PM/g, '<span class="suffix pm">PM</span>');

  $(this).html(newMarkup);
});

灵感来自：Fastest method to replace all instances of a character in a string

【讨论】：

或者，您可以预先添加带有 'suffix' 类的跨度，然后在标记中测试 AM/PM 是否存在并调用 jQuery 的 addClass('am') 或 addClass('pm')跨度。
@Marcel，我很高兴这是一个正则表达式。 :)
嗯，是的，你是对的。 :) 但是.replace('AM', '<span class="suffix am">AM</span>', 'g') 不使用正则表达式，这是相当昂贵的（但也许 JavaScript 引擎内部确实使用了一个）。
这是一个正则表达式！至少 /AM/g 部分。如果你想让它不区分大小写，你可以添加一个 i。例如 /AM/gi 会使其匹配 AM 或 am。
关于昂贵的评论，我不会完全不同意 - 这就是为什么我提供了一个只应用 CSS 类而不是操作 DOM 的替代想法。