1は、JSは、エスケープとアンエスケープHTMLを達成するため、主に二つの方法があります。
1）、エスケープHTMLブラウザ内部コンバータを利用し実現。
2）、エスケープHTMLを達成するために、正規表現で。
2、カプセル化されたツールのJS：
1 VAR HtmlUtil = { 2 / * コンバータ（エスケープ）の内部ブラウザによって実装1. HTMLコード* / 3。 htmlEncode：関数{（HTML） 。4 // 1は、DIVのように、動的に第一の容器のラベル要素を作成する 5。 VARを =のdocument.createElement TEMP（ "DIV" ）; 6 // 2.この要素のinnerTextかのTextContentに変換される文字列 7 （temp.textContent = HTML）：（TEMP（temp.textContent =未定義！）？ = .innerText HTML）; 8 // 3.最後に、要素は、符号化された変換されたHTMLの文字列を与えるために、すなわち、innerHTMLプロパティを返す 9。 VARの出力= temp.innerHTML; 10 TEMP =NULL ; 11 戻り、出力 12される }、 13は / * 2 HTML復号（逆センス）コンバータ内部ブラウザ達成* / 14 ：HtmlDecode 機能（テキスト）{ 15 // 1.第一の容器のラベルを動的要素を作成しますDIVなど 16 のvar TEMP =のdocument.createElement（ "DIV" ）; 。17 // 2.その後、innerHTMLの列要素（IE、Firefoxの、Googleサポート）に変換される 18で temp.innerHTML = テキスト; 。19 // 3.最後に、HTMLを介してデコードされた文字列を取得するために、即ち、のinnerText又は要素を返すのTextContent。 20は、 VaRの出力= temp.innerText || temp.textContent; 21れます 温度= nullを。 22 リターン出力。 23 }、 24 / * 正则表达式实现HTML用3.编码（转义）* / 25 htmlEncodeByRegExp：関数（STR）{ 26 VAR TEMP = "" ; 27 もし（str.length == 0）リターン "" ; 28 TEMP = str.replace（/＆/ gで、 "＆＃038;" ）; 29 TEMP = temp.replace（/ </ gであり、 "＆LT;" ）; 30 TEMP = temp.replace（/> / gであり、 "＆GT;" ）; 31 TEMP = temp.replace（/ \ S / G、 "＆NBSP;" ）; 32 TEMP = temp.replace（/ \ '/ G "＆＃39;" ）; 33 TEMP = temp.replace（/ \ "/ gであり、" ＆QUOT;」）; 34 戻り温度; 35 } 36 / * 正则表达式实现HTML解码（反转义）用4 * / 37 htmlDecodeByRegExp：関数（ STR）{ 38 VaRの TEMP = "" ; 39 であれば（str.length == 0）リターン "" ; 40 TEMP = str.replace（/＆＃038; / gであり、 "＆" ）; 41 temp.replace = TEMP（/＆LT; / G、 "<" ）; 42である TEMP = temp.replace（/＆GT; / G、 ">" ）; 43である TEMP = temp.replace（/＆NBSP; / G "" ）; 44である TEMP = temp.replace（/＆＃39; / G、 "\「" ）; 45 TEMP = temp.replace（/＆QUOT; / G、 "\" " ）; 46で リターンTEMP; 47 } 48 / * 5.正規表現のHTMLコード（エスケープ）（別の方法）* / 49 html2Escape：関数（SHTML）{ 50 リターン sHtml.replace（/ [<>＆「] / G、関数（C）{ リターン{ '<'： '＆LT;'、 '>'： '＆GT;'、 '＆'： '＆＃038;'、 '「'： '＆QUOT;' } [C];}）; 51である }、 52であります * / 前記正規表現HTML復号（逆センス）（別の方法）を使用して* / 53である escape2Html：関数（STR）{ 54で のvar arrEntities = { 'LT'： '<'、 'GT'： '>' 、 'NBSP'： ''、 'アンプ'： '＆'、 'QUOT'： '「' }; 55 リターン str.replace（/＆（LT | GT | NBSP |アンプ| QUOT）; / IG、関数（全て、T）{ 戻りarrEntities [T];}）; 56である } 57です }。
3、テストと結果：
1）、HTMLコード：
1 < DIV >＆</ DIV > 2 < divの> ＆＃038; </ DIV > 3 < DIV ID = "testdiv" > </ DIV > 4 < DIV ID = "testdiv1" > </ DIV > 5 < DIV ID = "testdiv2" > </ DIV > 6 7 < DIV ID =」 regdiv」> </ DIV > > </ DIV > 9 < DIV ID = "regdiv2" > </ DIV > 10 11 < DIV ID = "regdiv3" > </ DIV > 12 < DIV ID = "regdiv4" > </ DIV > 13 < DIV ID = "regdiv5" > </ DIV >
2）、JSテストコード：
1つの VAR strHtml = '<divのスタイル= "色：青">符号：＆＃038;の<div>' ; 2 。のdocument.getElementById（ "testdiv"）のinnerHTML = strHtml。 3 4 VAR encodedHtml = HtmlUtil.htmlEncode（strHtml）。// "＆LT; divのスタイル="色：青"＆GT;符号：＆＃038;アンプ;＆lt; div＆gt;で" 5 。のdocument.getElementById（ "testdiv1"）のinnerHTML = encodedHtml。 6 7 VAR decodedHtml = HtmlUtil.htmlDecode（encodedHtml）。// '<divのスタイル= "色：青">符号：＆＃038;の<div>' 8 のdocument.getElementById（ "testdiv2"）。innerHTMLの= decodedHtml。 9 10 VARstrHtml_1 = '<divのスタイル= "色：赤">符号：＆＃038;の<div>' ; 11 。のdocument.getElementById（ "regdiv"）のinnerHTML = strHtml_1。 12 13 VAR encodedHtml_1 = HtmlUtil.htmlEncodeByRegExp（strHtml_1）。// "＆LT; divのスタイル="色：赤"＆GT;符号：＆＃038;アンプ;＆lt; div＆gt;で" 14 。のdocument.getElementById（ "regdiv1"）のinnerHTML = encodedHtml_1。 15 16 VAR decodedHtml_1 = HtmlUtil.htmlDecodeByRegExp（encodedHtml_1）。// '<divのスタイル= "色：青">符号：＆＃038;の<div>' 17 のdocument.getElementById（ "regdiv2"）。innerHTMLの= decodedHtml_1。 18 19 VARstrHtml_2 = '<divのスタイル= "色：緑">符号：＆＃038;の<div>' ; 20 。のdocument.getElementById（ "regdiv3"）のinnerHTML = strHtml_2。 21 22 VAR encodedHtml_2 = HtmlUtil.htmlEncodeByRegExp（strHtml_2）。// "＆LT; divのスタイル="色：緑"＆GT;符号：＆＃038;アンプ;＆lt; div＆gt;で" 23 。のdocument.getElementById（ "regdiv4"）のinnerHTML = encodedHtml_2。 24 25 VAR decodedHtml_2 = HtmlUtil.htmlDecodeByRegExp（encodedHtml_2）。// '<divのスタイル= "色：緑">符号：＆＃038;の<div>' 26 のdocument.getElementById（ "regdiv5"）。
3）、レンダリング：
----------------------------------