使用jquery将括号中的文本包装在span标签中？ [复制]答案

【问题标题】：Wrap text in parenthesis in a span tag using jquery? [duplicate]使用jquery将括号中的文本包装在span标签中？ [复制]
【发布时间】：2017-10-15 20:29:30
【问题描述】：

我正在使用 Wordpress 中的一些标题。有些标题是剧集名称，有些是文章名称。 Podcast 剧集名称标题如下所示：

<h1>Hello i am a title (EP.11)</h1>

播客剧集标题在标题末尾的括号中包含剧集编号。我希望使用一些 jQuery 将括号及其包含的文本包装到 span 标记中，就像这样

<h1>
  Hello i am a title 
  <span class="titleEpisodeValue">(EP.11)</span> 
</h1>

非常感谢任何帮助！

这是播客网站的常见问题。我希望我的问题的细节能吸引类似的人。谢谢。

【问题讨论】：

到目前为止你尝试过什么？您自己的任何尝试或研究？

标签： javascript jquery

【解决方案1】：

要实现这一点，您可以使用正则表达式捕获括号内的值，然后将其替换为包含该文本的span。像这样的：

$('h1').html(function(i, h) {
  return h.replace(/(\(.+\))/g, '<span class="titleEpisodeValue">$1</span>');
});

.titleEpisodeValue { color: #C00; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>Hello i am a title (EP.11)</h1>

【讨论】：

这很好用，谢谢！ $1 怎么知道那是内容？
说我需要等待更多时间来奖励答案。
没问题，很高兴为您提供帮助。 $1 是正则表达式中匹配组的占位符：stackoverflow.com/questions/16702924/…

【解决方案2】：

var H1=$("h1").html();
var code=H1.substring(H1.indexOf("("), H1.indexOf(")")+1);
$("h1").html(H1.substring(0,H1.indexOf("("))).append($("<span/>",{html:code}));

h1 &gt;span{color:pink;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>Hello i am a title (EP.11)</h1>

【讨论】：