"JavaScript" Some characters are not escaped can cause the Web page to crash with the display method involving escape characters

In front-end development work, it is often necessary to escape the left and right angle brackets of HTML into solid form. We can't just show <,>,& and so on to the final page we see. It needs to be escaped before it can be displayed on a Web page. The escape character (Escape Sequence) is also called the character entity (Character entity). The main reason for defining an escaped string is that 1, "<" and ">" symbols have been used to represent HTML tags and therefore cannot be used directly as symbols in text. But sometimes the requirement is to use these symbols on an HTML page, so you need to define its escape string. 2. Some characters are not defined in the ASCII character set (such as the copyright symbol "?"). ）。 Therefore, you need to use the escape character ("?" The corresponding escape character is "©" ) to indicate.

In other words, for example <div>a</div> is not displayed directly in the Web page, it must be escaped before it can be displayed. If you do not escape it will bring a lot of harm to the Web page, can cause the Web page to crash.

If <div>a is displayed directly in the Web page, that is, <div>a is placed directly into a piece of HTML code, the entire page is a fault, the HTML can not be explained completely. It must be written <div&rt;a to be able to display normally in the Web page.

For example, the following examples:

First look at the following code, this page in addition to an ID of the HTML inline text span There is nothing, I intended to display <div>a</div>, but a little bit of HTML knowledge is not shown, the final result is a:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
At the same time, more frightening is the situation:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
I was going to show a</span></body>

Only one a turns red, and even some browsers can't parse 
Some people still think it's trivial, because when we're programming in HTML, it's not so boring to show </span></body>
Like what:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
Set the content of the inline text with the ID of HTML is <div>a</div>, although it is not usually written at all, but if you give an input box to the user to input things, and then re-display this thing, more in the comment system, you can ensure that users do not enter <div>a</div>? So, you have to use the transcoding function:
var keys = Object.keys | | function (obj) {obj = Object (obj) var arr = [] for (var a in obj) Arr.push (a) return arr}var invert = funct  Ion (obj) {obj = Object (obj) var result = {} for (Var a in obj) result[obj[a]] = a return Result}var entitymap      = {escape: {' & ': ' & ', ' < ': ' < ', ' > ': ' > ', ' ': ' "', ' ': '   ',       /* If your later Web program also involves filenames, file operations, such as import and export functions, you'd better add the following rules in this mapping table, turn the half-width to the corner, otherwise it may be wrong ' \ \ ': ' \ ', '/': '/', ': ': ', '*' : '＊', '?' : '？ ', ' | ': ' | ', */}}entitymap.unescape = invert (entitymap.escape); var entityreg={escape:regexp (' [' + keys  (Entitymap.escape). Join (') + '] ', ' g '), Unescape:regexp (' (' + Keys ' (entitymap.unescape). Join (' | ') + ') ', ' G ')}function        Htmlescape (HTML) {if (typeof html! = ' string ') return ' return ' html.replace (Entityreg.escape, function (match) { Return Entitymap.escape[match]})}function Htmlunescape (str) {if (typeof str! = ' string ') return ' return ' str.replace (Entityreg.unescape, function (match) {return Entitymap.unescape[match] })   }

The specific structure of this code is very complex, using the regular expression, I also difficult to understand the mystery, but you just remember when necessary, in which the mapping table to add escape rules, the display of the main call Htmlescape method, We mainly observed that the sensitive angle bracket escape is OK, such as the following a program, I want to be in the page in the line text display <div>a</div> display does not appear, but after escaping is possible:

The code for the specific escape is as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">At the same time, because now the input method more do not retain the original full-width function, feel that the full-width input characters are more ugly, with a word2007 easy to convert half-width, full-angle method:
Also attach the HTML escape character, if the code is not, and you need to escape the character to be normal, or this character may endanger your Web project, you have to turn the half corner to the corner.


"JavaScript" Some characters are not escaped can cause the Web page to crash with the display method involving escape characters