重複の可能性:
HTML をエスケープする方法
JavaScriptで文字列をHTMLに変換するにはどうすればよいですか?
例えば
var unsafestring = "<oohlook&atme>";
var safestring = magic(unsafestring);
今どこにsafestring
等しい"<ohhlook&atme>"
を探していmagic(...)
ます。私はJQueryを使用していませんmagic
。
重複の可能性:
HTML をエスケープする方法
JavaScriptで文字列をHTMLに変換するにはどうすればよいですか?
例えば
var unsafestring = "<oohlook&atme>";
var safestring = magic(unsafestring);
今どこにsafestring
等しい"<ohhlook&atme>"
を探していmagic(...)
ます。私はJQueryを使用していませんmagic
。
function htmlEntities(str) {
return String(str).replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"');
}
それで、var unsafestring = "<oohlook&atme>";
あなたと一緒に使用しますhtmlEntities(unsafestring);
エンコーディングを気にしないでください。代わりにテキスト ノードを使用してください。テキストノードのデータは、テキストとして扱われることが保証されています。
document.body.appendChild(document.createTextNode("Your&funky<text>here"))
最も一般的に使用される方法は、この目的でjQueryを使用することです。
var safestring = $('<div>').text(unsafestring).html();
すべてのHTMLエンティティをエンコードする場合は、ライブラリを使用するか、自分で作成する必要があります。
HTMLエンコーダーやデコードなど、jQueryよりもコンパクトなライブラリを使用できます
と をエスケープする必要が<
あり&
ます。エスケープ>
も問題ありません。
function magic(input) {
input = input.replace(/&/g, '&');
input = input.replace(/</g, '<');
input = input.replace(/>/g, '>');
return input;
}
または、DOM エンジンに面倒な作業を任せます (私は怠け者なので jQuery を使用します)。
function magic(input) {
return $('<span>').text(input).html();
}
これが行うことは、ダミー要素を作成し、文字列をそのtextContentとして割り当てることです(つまり、HTML 固有の文字は単なるテキストであるため、副作用はありません)。次に、その要素の HTML コンテンツを取得します。これはテキストですが、特殊文字が変換されています。必要に応じて HTML エンティティに。
エスケープが必要な唯一の文字はです<
。(>
タグの外では意味がありません)。
したがって、「魔法の」コードは次のとおりです。
safestring = unsafestring.replace(/</g,'<');