我使用pre显示代码
code = "#include <stdio.h> int main(){printf("hello world!\n")}"
$(this).html("<pre>"+code+"</pre>");
带是html会把<stdio.h>
解析成一个标签,整个代码就乱了,有什么办法不解析这一部分么.
<stdio.h>
我是这样做的
$("<pre></pre>").appendTo(this);
$("pre").text(code);
在我的上下文里面是满足了……
什么字符是敏感的?何时使用<
,何时使用<
?
要理解这个问题,需要先了解一下HTML构建文档树时期,Tokenize过程中需要被差别对待的五类元素:
- Void elements:内部不包含文本,即
area
,base
,br
,col
,embed
,hr
,img
,input
,keygen
,link
,menuitem
,meta
,param
,source
,track
,wbr
- Raw text elements:即
script
和style
. - RCDATA elements:即
textarea
和title
. - Foreign elements:一些来自
MATHML
和SVG
的元素。 - Normal elements,以上四种类型之外的其他元素。
1没有内部文本,4超出了讨论范围,其他元素内部文本的解析规则各不相同:
Raw text elements
-
<
就表示<
字符本身,不会被当作 tag open 来解析 -
<
不会根据实体字符来转义 - 内部文本不能包含
</script>
和</style>
RCDATA elements
-
<
就表示<
字符本身,不会被当作 tag open 来解析 -
<
会被转义为<
- 内部文本不能包含
</textarea>
和</title>
Normal elements
-
<
会被当作 tag open 来解析 -
<
会被转义为<
总结出一个元素内部-输入-输出
表格既是:
元素 | 输入< | 输入< | 输入> |
script内部 | < | < | > |
style内部 | < | < | > |
title内部 | < | < | > |
textarea内部 | < | < | > |
[Normal elements]内部 | TAG OPEN | < | > |
所以,在<pre>
(即Normal Element)内部,<
被解析作Tag Open,因此需要额外转义。
ref:
- 玉伯的文章
- whatwg的相关标准