【问题标题】: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>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-04-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多