javascript - 在所有商标和注册商标符号周围添加上标标签

Question

我正在尝试<sup></sup>在页面中的每个 ™、®、© 周围添加标签。

我发现了这个问题：CSS 上标注册商标，它帮助我入门。

该脚本的工作原理是将标签放置在正确的位置，但它<sup></sup>在每个标签周围添加了两个标签，而不仅仅是一个。

这是我的 JS 添加标签：

jQuery("body").html(
    jQuery("body").html().replace(/&reg;/gi, '<sup>&reg;</sup>').replace(/®/gi, '<sup>&reg;</sup>').
        replace(/&trade;/gi, '<sup>&trade;</sup>').
        replace(/™/gi, '<sup>&trade;</sup>').
        replace(/&copy;/gi, '<sup>&copy;</sup>').
        replace(/©/gi, '<sup>&copy;</sup>')
);

如何确保每个符号只添加一次标签？也许是某种条件？

Answer 1

而不是重写整个标记（并删除所有绑定事件），我会去做这样的事情：

$('body :not(script)').contents().filter(function() {
    return this.nodeType === 3;
}).replaceWith(function() {
    return this.nodeValue.replace(/[™®©]/g, '<sup>$&</sup>');
});

演示：http: //jsfiddle.net/QTfxC/

Answer 2

这对我有用。

$("p,h1,h2,h3,h4,li,a").each(function(){
    $(this).html($(this).html().replace(/&reg;/gi, '<sup>&reg;</sup>').replace(/®/gi, '<sup>&reg;   </sup>'));
});

Answer 3

@VisioN 的答案对我来说效果不佳，尽管它面向正确的方向。我稍微调整了一下：

var regexp = /[\xAE]/;
$('body :not(script,sup)').contents().filter(function() {
    return this.nodeType === 3 && (regexp.test(this.nodeValue));
}).replaceWith(function() {
    return this.nodeValue.replace(regexp, '<sup>$&</sup>');
});

此方法使用字符 hex，而不是使用字符代码。我在character-codes.com上查找了十六进制并选择了 ® 字符的十六进制字符。价值就是AE这样我得到了我的解决方案。让我知道这个是否对您有用！

Answer 4

这在我的 Drupal 8 网站上对我有用：

(function ($, Drupal) {
var regexp = /[\u2122]/;
$('body :not(script,sup)').contents().filter(function() {
    return this.nodeType === 3 && (regexp.test(this.nodeValue));
}).replaceWith(function() {
    return this.nodeValue.replace("\u2122", "<sup>&trade;</sup>");
});
})(jQuery, Drupal);