在所有商标和注册商标符号周围添加上标 <sup> 标签

Posted 2023-02-24

【中文标题】在所有商标和注册商标符号周围添加上标 <sup> 标签

【英文标题】：Adding superscript <sup> tags around all trademark and registered trademark symbols

【发布时间】：2013-10-22 06:36:11

【问题描述】：

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

我发现了这个问题：CSS superscript registration trademark，它帮助我开始了。

该脚本在将标签放置在正确位置的意义上起作用，但它在每个标签周围添加了两个<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>')
);

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

【问题讨论】：

如果你只替换™（不是™）会发生什么。而反过来呢？我怀疑jQuery("body").html() 正在做一些隐式转换。

这就是我最初认为的问题，但删除它们并不会改变任何事情。

为什么不手动更改源？替换 body 元素的 html 非常麻烦且容易出错。

@TyBailey 好的，那么如果您只调用一次replace 而不是将多个链接在一起会发生什么？这是否按预期工作？

顺便说一句，在包含大量内容的页面上执行此操作会非常缓慢。 @undefined 是对的 - 从源头更改它！

【参考方案1】：

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

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

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

【讨论】：

这很棒！谢谢你。我会尽快接受答案。

Hey Vision，你能帮我修改一下以检查符号周围是否已经有<sup> 标签吗？如果存在则不要通过脚本添加，如果不存在则添加？

@TyBailey 当然。只需添加<sup> 标签进行过滤，即:not(script,sup)。 演示： jsfiddle.net/QTfxC/1.

Wrapping ™ in 实际上是不需要的，因为它总是有较高的位置。

【参考方案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>'));
);

【参考方案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>');
);

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

【讨论】：

如果您的内容来自混合来源或由多人输入，则在 :not 排除项中包含 sup 很重要，请务必这样做。

【参考方案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);