带有 html 标签的字符串作为选择器答案

【问题标题】：String with html tag as selector带有 html 标签的字符串作为选择器
【发布时间】：2012-01-20 09:17:57
【问题描述】：

我正在开发一个使用 I18N 的网站。

我有一个翻译团队负责检查网站上的翻译。

如果他们愿意，他们可以通过将鼠标放在他们要翻译的字符串上来提供新的翻译。

我需要检测 PO 文件中当前页面上使用的所有字符串，并在字符串的直接父级上添加一个类，以便我可以添加文本输入以提交新翻译。

所以我创建了一个函数来存储当前页面中使用的每个翻译（PO 文件中的基本字符串和 PHP 注入数据的最终翻译）并将它们作为 JSON 对象传递给 JavaScript。

现在，我必须在页面中找到所有这些翻译。

我的问题是在它们包含 html 标记时匹配它们。

在我的 PO 文件中：

msgid "Bonjour <strong>%s</strong>"
msgstr "Hi <strong>%s</strong>"

我的页面来源：

<div>Hi <strong>Tristan</strong></div>

这里需要

我该如何匹配？我想我需要使用翻译后的字符串作为选择器。

我想避免在 PHP 处理期间用一个元素包装 i18n 字符串（因为它会以某种方式改变 DOM 并因此对网站的设计产生影响），但另一方面，用PO 文件中的字符串在浏览器端似乎也很重。

有什么提示吗？

【问题讨论】：

您应该将字符串包装在元素中，几乎可以肯定是span 标签。如果您的 CSS 或 JS 无法处理插入的无样式 span 元素，那么我的书中写得不好。
问题，您的网站逻辑是添加 标签还是翻译者？
@lonesomeday，我同意你的看法。问题是没有人是完美的，所以我想要一个不修改 DOM 的解决方案。
@mreyeros，在这种情况下，它是站点逻辑。但是翻译人员与设计师合作，所以在某些情况下，这可能是他们的主动...
嗯，好吧，我想我真的应该问一下逻辑是否正在生成并显示已翻译提交的 HTML，例如，如果逻辑正在获取 msgstr 并生成相应的
和相关的翻译，您是否可以修改您的 html 生成以向这些 div 添加一个类，以便您可以使用 jquery 查找所有这些 div 并附加一个输入元素或您需要允许翻译的任何其他 html。

【解决方案1】：

在@lonesomeday 之后，我也会使用跨度。这就是他们的目的。这是跨度应该在的位置：

msgid "Bonjour %s"msgstr "Hi %s" 变成：

javascript 然后变成：

$(document).ready(function(){
  $('.I18N').closest('*').addClass('inputI18N');
});

【讨论】：