Question

我使用jQuery来定义单词组合中的连字符，以便应用特殊样式。

单词是过滤系统的一部分，如下所示：

<ul id="filters" >
<li class="current"><a href="#all">All-Work</a>
<ul>
<li><a class="filterName" href="#Branding-and-Logo">Branding-and-Logo</a></li>
<li><a class="filterName" href="#Content-Management">Content-Management</a></li>
<li><a class="filterName" href="#Infographics">Infographics</a></li>
<li><a class="filterName" href="#Media-Integration">Media-Integration</a></li>
<li><a class="filterName" href="#Mobile-sites">Mobile-sites</a></li>
<li><a class="filterName" href="#Photography">Photography</a></li>
<li><a class="filterName" href="#Print">Print</a></li>
<li><a class="filterName" href="#Video">Video</a></li>
<li><a class="filterName" href="#Websites">Websites</a></li>
</ul>
</li>
</ul>

我使用以下jQuery来定位单词之间的连字符：

$('a:contains("-")').html(function () {
return $(this).text().replace('-', '<span class="hideme">-</span>')
});

这适用于除列表中第一项之外的所有实例：Branding-and-Logo，其中第二个连字符未被修改。您可以看到第二个连字符仍然显示在列表here中。

还需要做些什么来定位第二个连字符和第一个连字符？

Answer 1

当我需要替换字符串的所有实例时，我通常使用split和join

return $(this).text().split('-').join('<span class="hideme">-</span>')

Answer 2

.replace仅替换参数中传递的第一个实例。您可以调用replace直到没有连字符，使用dave's answer（这很好）或使用regExp全局标志：

return $(this).text().replace(/-/g, '<span class="hideme">-</span>');

Answer 3

Javascript替换功能仅替换模式的第一次出现。要替换所有内容，您必须使用正则表达式，例如：

$('a:contains("-")').html(function () {
    return $(this).text().replace(/-/g, '<span class="hideme">-</span>')
});

如何使用jQuery定位第二个字符

3 个答案: