HTML特殊字符轉義

時間 2019-12-13

標籤 html 特殊字符轉義欄目 HTML 简体版

原文原文鏈接

title: HTML特殊字符轉義html

date: 2019-02-18 21:57:00apache

categories:json

tech
language
HTML

tags: [tech,HTML,SpecialCharacters,Java,JavaScript]bash

問題

若是HTML的DOM元素的屬性值中含有特殊字符，會形成屬性值取值錯誤。ide

例如：ui

<input type="button" value=" "name":"Tom" " id="test"/>   
複製代碼

上面input的value屬性值含有雙引號,會形成最後解析到的value是空格。spa

解決方案

解決的辦法就是對數據進行轉義，轉義成HTML特殊符號的轉義字符。.net

經常使用的HTML特殊字符轉義對照表：code

字符	十進制	轉義字符
"	`"`	`"`
&	`&`	`&`
<	`<`	`<`
>	`>`	`>`
不斷開空格(non-breaking space)	` `	` `

實現

經過Java轉義：htm

org.apache.commons.lang3.StringEscapeUtils.escapeHtml4(com.alibaba.dubbo.common.json.Json.json(obj));
複製代碼

經過Js轉義：

<span style="font-size:18px;"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
<HTML>  
<HEAD>  
 <TITLE>test</TITLE>  
</HEAD>  
  
<body>  

<input type="button" value="" id="test"/>   

 <SCRIPT LANGUAGE="JavaScript">  
	function htmlEscape(text){ 
		  return text.replace(/[<>"&]/g, function(match, pos, originalText){ switch(match){ case "<": return "&lt;"; case ">":return "&gt;"; case "&":return "&amp;"; case "\"":return "&quot;"; 
		  } 
		}); 
	}
	var h=document.getElementsByTagName("input")[0];

	h.value=htmlEscape("[{\"name\":\"A Girl\'s Guide\"}]");
 </SCRIPT>  
 
</body>  
</HTML>
複製代碼