javascript - jQuery 替换 "small-caps"- 内容在

Question

我发现 jQuery 的这个 HOT 位实际上允许您复制“font-variant:small caps”。通常不是问题，但我使用的是@font-face，我几乎不知道它在 Chrome、Safari 和 IE 中不能很好地与 font-variant-small-caps 配合使用。长话短说，代码运行 SWEET 但它有一个缺点 - 由于某种原因，它正在搜索第一个用括号括起的文本字符串，然后在后面重复该文本字符串

例子...代码说:

<h3 class="small caps">I'm the FIRST heading</h3>
<h3 class="small caps">I'm SECOND</h3>

被脚本修改为:

<h3 class="small caps">I'm the FIRST heading</h3>
<h3 class="small caps">I'm the FIRST heading</h3>

这是在 jQuery 中施展魔法的代码:

    jQuery(document).ready(function($) {
        var text = $('h3.small-caps').html();
        $('h3.small-caps').html(text.replace(/\b([A-Za-z0-9])/g,'<span class="caps">$1</span>'));
        $('.caps').css('font-size',50);
    }); 

Answer 1

尝试:

jQuery(document).ready(function($) {
    $('h3.small-caps').each(function() {
        var $this = $(this);
        var text = $this.html();
        $this.html(text.replace(/\b([A-Za-z0-9])/g,'<span class="caps">$1</span>'));
    });
    $('.caps').css('font-size',50);
});