html - 如何正确转义 标签内的文本？

Question

在 HTML 文档中插入不受信任的文本时，您必须转义某些特殊字符(例如 <、&、"等)。("用于带引号的属性)。例如:

<div>Some tags are <b> and <div></div>

变成:

<div>Some tags are &lt;b&gt; and &lt;div&gt;</div>

(人们可以争论是否需要 >，但这与此处无关。)

那很好，但是在选项标签内呢？如果我希望文本为“”，我该怎么做？

这不起作用:

<option>&lt;&sol;option&gt;</option>

我发现 HTML 字符实体(<、> 等)被删除了。我已经尝试过 Chrome 和 Firefox。我认为这与选项标签不能包含嵌套标签这一事实有关。谷歌在这方面让我失望了。 :(

还有一个相关的问题:因为 有特殊的转义行为，如上所示，我们知道 <script> 有它自己的行为。是否有所有具有特殊转义行为的 HTML 标记的完整列表及其规则？

谢谢。

Answer 1

如果我正确理解你的问题，如下面的代码片段所示，你可以在 <option> 中转义 HTML 实体。标签非常好(在 Firefox、Chrome 和 Safari 上测试过)。

所以你可以得到文本 </option>在选项标签内。这是使用表示 < 的 HTML 实体完成的。和 >字符

本质上它和拥有一样:

<option></option></option>

虽然中间</option>不被视为结束标记，而是在浏览器中以这种方式显示

作为旁注，使用 <option> 的唯一限制转义字符时的标签位于 :before和 :after CSS 伪元素。 W3建议您不能将内容添加到 <option>使用这些伪元素标记。尽管出于某种原因，在 Firefox 48 中这确实有效

#css-option:before {
  content: "any text";
}

<select>
  <option>&lt;/option&gt;</option>
  <option>&#60;/option&#62;</option>
  <option>&lt;&sol;option&gt;</option>
  <option id="css-option"></option>
</select>