HTML文字列をアンエスケープ

HTML文字列をアンエスケープするには次のような方法で可能です。

関数定義

JavaScript

/**
 * HTML文字列をアンエスケープ
 * @param {string} str エスケープされたHTML文字列
 * @return {string} アンエスケープされたHTML文字列を返す
 */
var unescapeHtml = function(str) {
	if (typeof str !== 'string') return str;

	var patterns = {
		'&lt;'   : '<',
		'&gt;'   : '>',
		'&amp;'  : '&',
		'&quot;' : '"',
		'&#x27;' : '\'',
		'&#x60;' : '`'
	};

	return str.replace(/&(lt|gt|amp|quot|#x27|#x60);/g, function(match) {
		return patterns[match];
	});
};

簡単な解説

HTMLのうち文字実体参照または数値文字参照から<、>、&、"、'、`へ変換します。
エスケープされたHTMLの文字列から、対象のパターンに一致した文字参照を置換するような処理になっています。

使い方

var result = unescapeHtml( convertString );

引数

引数名		型	説明
第一引数必須	convertString	string	変換したいHTML文字列

戻り値

アンエスケープされた文字列を返します。

サンプルコード

JavaScript

var htmlStr = '&lt;div id=&quot;sample&quot;&gt;&lt;p class=&quot;text&quot;&gt;foo&lt;br&gt;&lt;a href=&quot;https://example.co.jp/?k1=v1&amp;k2=v2&quot; target=&quot;_blank&quot;&gt;bar&lt;/a&gt;&lt;/p&gt;&lt;/div&gt;';

var result = unescapeHtml(htmlStr);

alert(result); // <div id="sample"><p class="text">foo<br><a href="https://example.co.jp/?k1=v1&k2=v2" target="_blank">bar</a></p></div>

JavaScript逆引きリファレンス一覧へ戻る