HTML Entity 字符实体
目录
1. HTML Entity
1. HTML Entity
1.1 介绍
在编写HTML页面时,需要用到"<"、">"、"空格"等符号,直接输入这些符号时,会错误的把它们与标记混在一起,非常不利于编码。
那么就需要把这些字符进行转义,以另一种方式抒写,以相同的形式展现。
在HTML中,这些字符可称为HTML Entity,即HTML 字符实体。一个HTML Entity都含有2种转义格式:Entity Name 和 Entity Number。
可参考MDN关于HTML Entity的解释 :https://developer.mozilla.org/en-US/docs/Glossary/Entity
1.1.1 Entity Name
格式: &entityName;
说明:"&"开头,";"结尾,以语义的形式描述字符。如字符"<",英文名称为"less than",Entity Name为"<",取自"less than"2个单词的首字母。
1.1.2 Entity Number
格式: &#entityNumber;
说明:"&#"开头,";"结尾,以编号的形式描述字符。此编号可以为十进制或十六进制(以"&#x"开头)等数字格式。
1.1.3 示例
<p>字符 :<</p>
<p>Entity Name :<</p>
<p>Entity Number(十进制) :<</p>
<p>Entity Number(十六进制) :<</p>
可看到Entity Name、 Entity Number都在页面显示为"<"字符。
1.2 HTML Entity包括哪些字符呢?
包括但不限于以下字符:ASCII Characters(可见部分)、ISO 8859-1 Characters、ISO 8859-1 Symbols、Math Symbols、Greek Letters、Miscellaneous HTML entities。
在实际编码时不是所有字符都要转义的,比如a-z、A-Z等是没必要转义的。
2. 字符与Entity Name的互相转换
Entity Name 与 字符的互相转换只能依靠字符对照表转换。更多字符对照表可参考:https://www.freeformatter.com/html-entities.html
2.1 ASCII 字符列表:
Character | Entity Name | Entity Number(十进制) |
| ||
! | ! | ! |
" | " | " |
# | # | # |
$ | $ | $ |
% | % | % |
& | & | & |
' | ' | ' |
( | ( | ( |
) | ) | ) |
* | * | * |
+ | + | + |
, | , | , |
- | ‐ | - |
. | . | . |
/ | / | / |
: | : | : |
; | ; | ; |
< | < | < |
= | = | = |
> | > | > |
? | ? | ? |
@ | @ | @ |
[ | [ | [ |
\ | \ | \ |
] | ] | ] |
^ | ˆ | ^ |
_ | _ | _ |
` | ` | ` |
{ | { | { |
| | | | | |
} | } | } |
~ | ˜ | ~ |
2.2 字符转换为Entity Name
// ASCII字符集:char 2 entityName
var asciiChartSet_c2en = {
' ': ' ',
'!': '!',
'"': '"',
'#': '#',
'$': '$',
'%': '%',
'&': '&',
'\'': ''',
'(': '(',
')': ')',
'*': '*',
'+': '+',
',': ',',
'-': '‐',
'.': '.',
'/': '/',
':': ':',
';': ';',
'<': '<',
'=': '=',
'>': '>',
'?': '?',
'@': '@',
'[': '[',
'\\': '\',
']': ']',
'^': 'ˆ',
'_': '_',
'`': '`',
'{': '{',
'|': '|',
'}': '}',
'~': '˜'
} // e.g. 字符转换为Entity Name
var oldStr = '(中文)';
var newStr = oldStr.replace(/(\D{1})/g, function(matched) {
var rs = asciiChartSet_c2en[matched];
return rs == undefined ? matched : rs;
});
console.log(newStr); // => (中文)
2.3 Entity Name转换为字符
// ASCII字符集:entityName 2 char
var asciiChartSet_en2c = {
' ': ' ',
'!': '!',
'"': '"',
'#': '#',
'$': '$',
'%': '%',
'&': '&',
''': '\'',
'(': '(',
')': ')',
'*': '*',
'+': '+',
',': ',',
'‐': '-',
'.': '.',
'/': '/',
':': ':',
';': ';',
'<': '<',
'=': '=',
'>': '>',
'?': '?',
'@': '@',
'[': '[',
'\': '\\',
']': ']',
'ˆ': '^',
'_': '_',
'`': '`',
'{': '{',
'|': '|',
'}': '}',
'˜': '~',
} // e.g. Entity Name转换为字符
var oldStr = '(中文)';
var newStr = oldStr.replace(/(&.+?;)/g, function(matched) {
var rs = asciiChartSet_en2c[matched];
return rs == undefined ? matched : rs;
});
console.log(newStr); // => (中文)
3. 字符与Entity Number的互相转换
3.1 字符转换为Entity Number
String的实例方法 charCodeAt() 可把指定字符转换为编码:
var charCode = '('.charCodeAt(0); // => 40
var entityNumber = '&#' + charCode + ';' // => (
3.2 Entity Number转换为字符
String的静态方法 fromCharCode() 可把指定编码转换为字符,而Entity Number的编码可以为十进制或16进制,所以转换时进行分别处理:
/**
* Entity Number转换为字符
* @param {String} entityNumber entityNumber
*/
var getCharByEntityNumber = function(entityNumber) {
var num = entityNumber.replace('&#', '').replace(';', '');
if (num.indexOf('x') == 0) {
num = Number.parseInt(num, 16); // 16进制转换为10进制
} else {
num = Number.parseInt(num); // 10进制
}
var char = String.fromCharCode(num);
return char;
} // e.g.
var oldStr = '(中文)';
var newStr = oldStr.replace(/(&#\d+;)/g, function(matched) {
return getCharByEntityNumber(matched);
});
console.log(newStr); // => (中文)
HTML Entity 字符实体的更多相关文章
- HTML Entity 字符实体(字符转义)
目录 1. HTML Entity 2. 字符与Entity Name的互相转换 3. 字符与Entity Number的互相转换 1. HTML Entity 1.1 介绍 在编写HTML页面时,需 ...
- java转换 HTML字符实体,java特殊字符转义字符串
为什么要用转义字符串? HTML中<,>,&等有特殊含义(<,>,用于链接签,&用于转义),不能直接使用.这些符号是不显示在我们最终看到的网页里的,那如果我们希 ...
- JS魔法堂:再识ASCII实体、符号实体和字符实体
一.前言 相信大家都熟悉通过字符实体 来实现多个连续空格的输入吧!本文打算对三类HTML实体及JS相关操作作进一步的整理和小结,若有纰漏请大家指正,谢谢. 二.初识HTML实 ...
- Entity Framework 实体框架的形成之旅--实体框架的开发的几个经验总结
在前阵子,我对实体框架进行了一定的研究,然后把整个学习的过程开了一个系列,以逐步深入的方式解读实体框架的相关技术,期间每每碰到一些新的问题需要潜入研究.本文继续前面的主题介绍,着重从整体性的来总结一下 ...
- HTML字符实体(Character Entities),转义字符串(Escape Sequence)
为什么要用转义字符串? HTML中<,>,&等有特殊含义(<,>,用于链接签,&用于转义),不能直接使用.这些符号是不显示在我们最终看到的网页里的,那如果我们希 ...
- HTML字符实体(Character Entities),转义字符串(Escape Sequence)【转】
为什么要用转义字符串? HTML中<,>,&等有特殊含义(<,>,用于链接签,&用于转义),不能直接使用.这些符号是不显示在我们最终看到的网页里的,那如果我们希 ...
- html中空格字符实体整理
摘要 浏览器总是会截短 HTML 页面中的空格.如果您在文本中写 10 个空格,在显示该页面之前,浏览器会删除它们中的 9 个.如需在页面中增加空格的数量,您需要使用 字符实体. 本篇就单介绍空格的字 ...
- HTML字符实体(Character Entities),转义字符串(Escape Sequence) 转
为什么要用转义字符串? HTML中<,>,&等有特殊含义(<,>,用于链接签,&用于转义),不能直接使用.这些符号是不显示在我们最终看到的网页里的,那如果我们希 ...
- [转]HTML字符实体(Character Entities),转义字符串(Escape Sequence)
为什么要用转义字符串? HTML中<,>,&等有特殊含义(<,>,用于链接签,&用于转义),不能直接使用.这些符号是不显示在我们最终看到的网页里的,那如果我们希 ...
随机推荐
- Fatal error in launcher:Unable to create process using '"'
Windows下同时存在Python2和Python3使用pip时系统报错:Fatal error in launcher: Unable to create process using '" ...
- Ajax笔记 XHR XMLHttpRequest
XMLHttpRequest xhr XmlHttpRequest var request ; if(Windows.XMLHttpRequest) { request ...
- 真正从0开始用Unity3D制作类战地2玩法的类龙之谷、王者荣耀的手游(暨全平台游戏)
如题,(从2017年10月18日开始)正在利用业余时间研发一款神泣Shaiya2手游,引擎用Unity3D. 原因主要有2点: 对神泣太多感情,希望能做点什么来纪念乃至留下神泣这款网游: 时机已到,是 ...
- 入侵必练的CMD命令
入侵必练的CMD命令 我们都知道和目标主机建立IPC$连接后,要把后门,木马之类的软件传过去,其实这个命令是DOS基础的 命令,我这里就写个格式. 一.呵呵,命令一写就知道了吧,在网上看的太多了,其他 ...
- 使用原生php读写excel文件
最近在工作中遇到一个需求,需要将数据库中的数据导出到excel文件中,并下载excel文件.因为以前没做过,所以就百度了一下, 网上说的大多是使用PHPExcel类来操作excel文件,这还要去下载这 ...
- phalcon——闪存消息
使用两种适配器来定义消息传递给Flasher后的行为: (1)Phalcon\Flash\Direct:直接输出传递给flasher的消息 (2)Phalcon\Flash\Session:将消息临时 ...
- 开源纯C#工控网关+组态软件(四)上下位机通讯原理
一. 网关的功能:承上启下 最近有点忙,更新慢了.感谢园友们给予的支持,现在github上已经有.目标是最好的开源组态,看来又近一步^^ 之前有提到网关是物联网的关键环节,它的作用就是承上启下. ...
- 游标的小知识(借鉴and整理)
一.游标(用来存储多条查询数据的一种数据结构(结果集),它有一个指针,用来从上往下移动,从而达到遍历每条记录的作用) 游标也可以理解为逐行返回SQL语句的结果集 如何编写一个游标? 1.声明游标 de ...
- 运行第一个Go Web框架
GO 语言的web框架很多,相对来说, Beego 框架,入门简单,文档齐全(中文),功能强大,本文以Beego 示例. Beego提供了详细的开发文档:http://beego.me/docs/in ...
- hdu 6215 -- Brute Force Sorting(双向链表+队列)
题目链接 Problem Description Beerus needs to sort an array of N integers. Algorithms are not Beerus's st ...