2012-04-18 92 views
6

可能重複:
Escaping HTML strings with jQuery
JavaScript/jQuery HTML Encoding有沒有一種簡單的方法在JavaScript中將文本轉換爲HTML?

例如,如果我想向用戶顯示HTML格式的字符串x < 3我需要與&lt;更換<字符。是否有一個預構建函數可以在JavaScript中執行此操作,或者可能是將任何文本字符串轉換爲相應HTML的jQuery?

+0

http://stackoverflow.com/questions/24816/escaping-html-strings-with-jquery – rid 2012-04-18 19:47:08

+0

http://stackoverflow.com/questions/6020714/escape-html-使用-jquery – rid 2012-04-18 19:47:43

+0

10個答案...我可以得到另外2個關閉的選票嗎? – 2012-04-18 19:53:46

回答

7

如果你想使用jQuery,您可以使用text(string)方法。

$(".selector").text("x < 5"); 

http://api.jquery.com/text/

+0

明智的答案。 – 2012-04-18 19:53:47

3

或者,把它簡單,做到這一點

var str1 = "x < 3"; 
str1.replace(/</g, '&lt;'); 

下面是使用jQuery Source另一個問題

function htmlEscape(str) { 
    return String(str) 
      .replace(/&/g, '&amp;') 
      .replace(/"/g, '&quot;') 
      .replace(/'/g, '&#39;') 
      .replace(/</g, '&lt;') 
      .replace(/>/g, '&gt;'); 
} 

或者說,優秀的欺騙function

function htmlEncode(value){ 
    return $('<div/>').text(value).html(); 
} 

function htmlDecode(value){ 
    return $('<div/>').html(value).text(); 
} 
+0

但這並不能概括所有危險的文本字符。它只處理'<'的情況。 – Dejas 2012-04-18 19:49:05

+0

@Dejas,我已經更新了我的答案。請查看 – Starx 2012-04-18 19:53:16

0

讓我們說你已將該字符串存儲到變量

012中
k = " <!"#$\'"; 

那麼當你需要在「打印」的值,用

escape (k); 
+1

而字符串''x <3''將變成'x%20%3C%203'。 – dfsq 2012-04-18 19:48:37

+0

escape()適用於網絡傳輸,不適用於顯示。 <將被翻譯成%3C,不& lt; – primavera133 2012-04-18 19:54:53

0

有一個PHP函數名ヶ輛,我發現這對JS:

function HTMLentities(texte) { 

texte = texte.replace(/"/g,'&quot;'); // 34 22 
texte = texte.replace(/&/g,'&amp;'); // 38 26 
texte = texte.replace(/\'/g,'&#39;'); // 39 27 
texte = texte.replace(/</g,'&lt;'); // 60 3C 
texte = texte.replace(/>/g,'&gt;'); // 62 3E 
texte = texte.replace(/\^/g,'&circ;'); // 94 5E 
texte = texte.replace(/‘/g,'&lsquo;'); // 145 91 
texte = texte.replace(/’/g,'&rsquo;'); // 146 92 
texte = texte.replace(/「/g,'&ldquo;'); // 147 93 
texte = texte.replace(/」/g,'&rdquo;'); // 148 94 
texte = texte.replace(/•/g,'&bull;'); // 149 95 
texte = texte.replace(/–/g,'&ndash;'); // 150 96 
texte = texte.replace(/—/g,'&mdash;'); // 151 97 
texte = texte.replace(/˜/g,'&tilde;'); // 152 98 
texte = texte.replace(/™/g,'&trade;'); // 153 99 
texte = texte.replace(/š/g,'&scaron;'); // 154 9A 
texte = texte.replace(/›/g,'&rsaquo;'); // 155 9B 
texte = texte.replace(/œ/g,'&oelig;'); // 156 9C 
texte = texte.replace(//g,'&#357;'); // 157 9D 
texte = texte.replace(/ž/g,'&#382;'); // 158 9E 
texte = texte.replace(/Ÿ/g,'&Yuml;'); // 159 9F 
// texte = texte.replace(/ /g,'&nbsp;'); // 160 A0 
texte = texte.replace(/¡/g,'&iexcl;'); // 161 A1 
texte = texte.replace(/¢/g,'&cent;'); // 162 A2 
texte = texte.replace(/£/g,'&pound;'); // 163 A3 
//texte = texte.replace(/ /g,'&curren;'); // 164 A4 
texte = texte.replace(/¥/g,'&yen;'); // 165 A5 
texte = texte.replace(/¦/g,'&brvbar;'); // 166 A6 
texte = texte.replace(/§/g,'&sect;'); // 167 A7 
texte = texte.replace(/¨/g,'&uml;'); // 168 A8 
texte = texte.replace(/©/g,'&copy;'); // 169 A9 
texte = texte.replace(/ª/g,'&ordf;'); // 170 AA 
texte = texte.replace(/«/g,'&laquo;'); // 171 AB 
texte = texte.replace(/¬/g,'&not;'); // 172 AC 
texte = texte.replace(/­/g,'&shy;'); // 173 AD 
texte = texte.replace(/®/g,'&reg;'); // 174 AE 
texte = texte.replace(/¯/g,'&macr;'); // 175 AF 
texte = texte.replace(/°/g,'&deg;'); // 176 B0 
texte = texte.replace(/±/g,'&plusmn;'); // 177 B1 
texte = texte.replace(/²/g,'&sup2;'); // 178 B2 
texte = texte.replace(/³/g,'&sup3;'); // 179 B3 
texte = texte.replace(/´/g,'&acute;'); // 180 B4 
texte = texte.replace(/µ/g,'&micro;'); // 181 B5 
texte = texte.replace(/¶/g,'&para'); // 182 B6 
texte = texte.replace(/·/g,'&middot;'); // 183 B7 
texte = texte.replace(/¸/g,'&cedil;'); // 184 B8 
texte = texte.replace(/¹/g,'&sup1;'); // 185 B9 
texte = texte.replace(/º/g,'&ordm;'); // 186 BA 
texte = texte.replace(/»/g,'&raquo;'); // 187 BB 
texte = texte.replace(/¼/g,'&frac14;'); // 188 BC 
texte = texte.replace(/½/g,'&frac12;'); // 189 BD 
texte = texte.replace(/¾/g,'&frac34;'); // 190 BE 
texte = texte.replace(/¿/g,'&iquest;'); // 191 BF 
texte = texte.replace(/À/g,'&Agrave;'); // 192 C0 
texte = texte.replace(/Á/g,'&Aacute;'); // 193 C1 
texte = texte.replace(/Â/g,'&Acirc;'); // 194 C2 
texte = texte.replace(/Ã/g,'&Atilde;'); // 195 C3 
texte = texte.replace(/Ä/g,'&Auml;'); // 196 C4 
texte = texte.replace(/Å/g,'&Aring;'); // 197 C5 
texte = texte.replace(/Æ/g,'&AElig;'); // 198 C6 
texte = texte.replace(/Ç/g,'&Ccedil;'); // 199 C7 
texte = texte.replace(/È/g,'&Egrave;'); // 200 C8 
texte = texte.replace(/É/g,'&Eacute;'); // 201 C9 
texte = texte.replace(/Ê/g,'&Ecirc;'); // 202 CA 
texte = texte.replace(/Ë/g,'&Euml;'); // 203 CB 
texte = texte.replace(/Ì/g,'&Igrave;'); // 204 CC 
texte = texte.replace(/Í/g,'&Iacute;'); // 205 CD 
texte = texte.replace(/Î/g,'&Icirc;'); // 206 CE 
texte = texte.replace(/Ï/g,'&Iuml;'); // 207 CF 
texte = texte.replace(/Ð/g,'&ETH;'); // 208 D0 
texte = texte.replace(/Ñ/g,'&Ntilde;'); // 209 D1 
texte = texte.replace(/Ò/g,'&Ograve;'); // 210 D2 
texte = texte.replace(/Ó/g,'&Oacute;'); // 211 D3 
texte = texte.replace(/Ô/g,'&Ocirc;'); // 212 D4 
texte = texte.replace(/Õ/g,'&Otilde;'); // 213 D5 
texte = texte.replace(/Ö/g,'&Ouml;'); // 214 D6 
texte = texte.replace(/×/g,'&times;'); // 215 D7 
texte = texte.replace(/Ø/g,'&Oslash;'); // 216 D8 
texte = texte.replace(/Ù/g,'&Ugrave;'); // 217 D9 
texte = texte.replace(/Ú/g,'&Uacute;'); // 218 DA 
texte = texte.replace(/Û/g,'&Ucirc;'); // 219 DB 
texte = texte.replace(/Ü/g,'&Uuml;'); // 220 DC 
texte = texte.replace(/Ý/g,'&Yacute;'); // 221 DD 
texte = texte.replace(/Þ/g,'&THORN;'); // 222 DE 
texte = texte.replace(/ß/g,'&szlig;'); // 223 DF 
texte = texte.replace(/à/g,'&aacute;'); // 224 E0 
texte = texte.replace(/á/g,'&aacute;'); // 225 E1 
texte = texte.replace(/â/g,'&acirc;'); // 226 E2 
texte = texte.replace(/ã/g,'&atilde;'); // 227 E3 
texte = texte.replace(/ä/g,'&auml;'); // 228 E4 
texte = texte.replace(/å/g,'&aring;'); // 229 E5 
texte = texte.replace(/æ/g,'&aelig;'); // 230 E6 
texte = texte.replace(/ç/g,'&ccedil;'); // 231 E7 
texte = texte.replace(/è/g,'&egrave;'); // 232 E8 
texte = texte.replace(/é/g,'&eacute;'); // 233 E9 
texte = texte.replace(/ê/g,'&ecirc;'); // 234 EA 
texte = texte.replace(/ë/g,'&euml;'); // 235 EB 
texte = texte.replace(/ì/g,'&igrave;'); // 236 EC 
texte = texte.replace(/í/g,'&iacute;'); // 237 ED 
texte = texte.replace(/î/g,'&icirc;'); // 238 EE 
texte = texte.replace(/ï/g,'&iuml;'); // 239 EF 
texte = texte.replace(/ð/g,'&eth;'); // 240 F0 
texte = texte.replace(/ñ/g,'&ntilde;'); // 241 F1 
texte = texte.replace(/ò/g,'&ograve;'); // 242 F2 
texte = texte.replace(/ó/g,'&oacute;'); // 243 F3 
texte = texte.replace(/ô/g,'&ocirc;'); // 244 F4 
texte = texte.replace(/õ/g,'&otilde;'); // 245 F5 
texte = texte.replace(/ö/g,'&ouml;'); // 246 F6 
texte = texte.replace(/÷/g,'&divide;'); // 247 F7 
texte = texte.replace(/ø/g,'&oslash;'); // 248 F8 
texte = texte.replace(/ù/g,'&ugrave;'); // 249 F9 
texte = texte.replace(/ú/g,'&uacute;'); // 250 FA 
texte = texte.replace(/û/g,'&ucirc;'); // 251 FB 
texte = texte.replace(/ü/g,'&uuml;'); // 252 FC 
texte = texte.replace(/ý/g,'&yacute;'); // 253 FD 
texte = texte.replace(/þ/g,'&thorn;'); // 254 FE 
texte = texte.replace(/ÿ/g,'&yuml;'); // 255 FF 
return texte; 
} 
+0

這看起來好像會起作用,但我認爲這可能太費時。 – 2012-04-18 19:51:47

+0

我同意,這是一個完整的方案來回答這個問題。 – 2012-04-18 19:55:23

0

這將替換的字符在javascript:

function replaceStr(str) { 
    return str 
     .replace(/&/g, "&amp;") 
     .replace(/</g, "&lt;") 
     .replace(/>/g, "&gt;") 
     .replace(/"/g, "&quot;") 
     .replace(/'/g, "&#039;"); 
} 
3

使用jQuery也許你不必HTML編碼文本:

$("div.test").text("<b></b> for bold!"); 

將div的內部html設置爲:

&lt;b&gt;&lt;/b&gt; for bold! 

You ca N,然後使用檢索這個網站:

$("div.test").html(); 
2

您可以使用jQuery功率:

var str = "x < 3"; 
str = $('<div>').text(str).html(); 

會給你"x &lt; 3"的結果。字符串"Alpha & Omega"將變成"Alpha &amp; Omega"

相關問題