我想向HTML页面添加信息，该页面对JavaScript可见，但对最终用户不可见。我想让原始的HTML页面尽可能简单。一种解决方案是使用非标准标签，例如<custom> ... </custom>
我知道official way of adding custom elements，但我的目的不是要在屏幕上显示任何内容，因此使用CustomElementRegistry似乎有些过分。
这是我的用例。我正在为学习英语的人创建一个“辅助阅读器” Web应用程序。我的JavaScript代码将<span>元素添加到普通的HTML页面中，并包含对读者来说是新单词。例如，JavaScript代码将更改纯HTML ...
<p>The word "thought" may be new to elementary learners.</p>
...到：
<p>The word "<span data-info="think">thought</span>" may be new to elementary learners.</p>
（跨度的data-info属性提供了信息，稍后在用户将鼠标悬停在单词上时使用该信息来显示图像，定义和示例，但这在这里并不重要。）
这些文字来自非网络开发人员，一开始根本没有任何标记。我在写两种工具：一种离线和一种在线。离线工具将词汇表与学生期望在不同级别上知道的单词列表进行比较，并允许不懂技术的编辑者收集同一单词的不同词尾变化（例如：丢失|丢失|丢失|丢失）出现在给定的文本中，以便可以将它们视为相同的词根。这会产生一系列学生可能想了解更多的术语。每个术语均以字符串形式存储，可以转换为正则表达式。例如"los(?:e|es|t|ing)"。
在线网页将收到：
在线代码将遍历数组，在原始文本中查找每个正则表达式（例如，/thought|thinks?/）的匹配项，并将相同的跨度添加到找到的所有匹配项中。必要时还将添加<p>标签。
但是，单词“ thought”可以是动词，也可以是名词：“昨天我想...”（动词）或“昨天我有想法...”（名词）。在第二种情况下，我需要使用其他正则表达式：/ thoughts？/，以允许单数和复数形式。
但是，这两个正则表达式都将找到“思想”的匹配项，这是我需要解决的问题。
这是“信息隐藏”的来源。一种解决方案是让我的离线工具像这样在原始文本中添加标签...
昨天我想...昨天我想了...
然后我可以为每种情况使用不同的正则表达式，并且不会发生冲突。
/<verb>(thought|thinks?)<\/verb>/
/<noun>(thoughts?)<\/noun>/
由于这些标签不会在浏览器中显示，因此它们可以保留在原位...还是可以？
以这种方式使用非标准和未声明的标签是否存在危险？
答案 0 :(得分：1)
为什么不像开始时那样用跨度来包裹它，并添加一个称为“数据类型”的属性。
会给：
<p>Yesterday I <span data-info="think" data-type="verb">thought</<span> ... Yesterday I had a <span data-info="think" data-type="noun">thought</span> ... <p>