一、名词解释
HTML实体字符:
由于在HTML中有些符号是预留的,比如在html中不能直接使用尖括号(‘<’或‘>’),会被误认为标签符号。所以需要通过HTML实体字符去进行替换;
HTML实体字符两种形式:
eg:小于号的HTML实体字符显示方式
数字形式:<
实体名形式:<
注意:使用实体名而不是数字的好处是,名称易于记忆。不过坏处是,浏览器也许并不支持所有实体名称(对实体数字的支持却很好)。
二、常见HTML实体字符
注释:实体名称大小写敏感!!!
显示结果 | 描述 | 实体名称 | 实体编号 |
---|---|---|---|
空格 | |   | |
< | 小于号 | < | < |
> | 大于号 | > | > |
& | 与号 | & | & |
" | 双引号 | " | " |
' | 单引号 | '(IE不支持) | ' |
全部HTML实体字符表,请查看http://www.w3school.com.cn/tags/html_ref_entities.html
三、转义实用场景-预防XSS攻击
1、什么是XSS攻击
向页面中植入恶意HTML或者恶意脚本,并且使页面提供给其他用户使用。
2、XSS的分类
四、转义、反转义HTML实体字符
/**
* 把html转义成HTML实体字符
* @param str
* @returns {string}
* @constructor
*/
function htmlEncode(str) {
var s = "";
if (str.length === 0) {
return "";
}
s = str.replace(/&/g, "&");
s = s.replace(/</g, "<");
s = s.replace(/>/g, ">");
s = s.replace(/ /g, " ");
s = s.replace(/\'/g, "'");//IE下不支持实体名称
s = s.replace(/\"/g, """);
return s;
}
/**
* 转义字符还原成html字符
* @param str
* @returns {string}
* @constructor
*/
function htmlRestore(str) {
var s = "";
if (str.length === 0) {
return "";
}
s = str.replace(/&/g, "&");
s = s.replace(/</g, "<");
s = s.replace(/>/g, ">");
s = s.replace(/ /g, " ");
s = s.replace(/'/g, "\'");
s = s.replace(/"/g, "\"");
return s;
}
!