jQueryでユーザーが編集可能な文字列をページ上に表示する際にエスケープする方法
GETパラメータを取得し、その内容をページ上に表示したいケースがあった。また、ASPを利用したサイトのためPHPが利用不可だった。かといってjQueryのhtml()で出力するとJSのalertとかがそのまま実行されてしまうため危険っぽい。そのためjQueryでエスケープしつつ表示する方法をメモ。
対応方法
ソースコード
//GETパラメータが入る変数
const param = 'xxxxx';
//これだとアウト(alertが実行された)
$(`.sample`).html(`${param}`);
//これだとセーフ(alertが実行されなかった)
$(`.sample`).text(`${param}`);
JavaScriptの場合
innerHTMLでもscriptタグが直接入力されている場合は実行されないらしい。実際に試してみたところ実行されなかった。
関連記事
-
-
AjaxFileUploadで処理は実行できてもエラーが返る
AjaxFileUploadでPHPに通信し、サーバー側のPHPで処理は正常に実 ...
-
-
AjaxのJSONP使用でPHPで作った配列をJSに返す方法
AというサイトからBというサイトにAjax通信し、Bの方ではMySQLに接続して ...
-
-
jQueryにてclosestの使いどころとparent / parentsとの違いについて
あるソースコードを見ているとjQueryにてclosest()という使ったことの ...
-
-
jQueryで新しく追加した要素に対してイベントがきかない場合の対応
jQueryで新たに追加した要素に対して、 clickイベントを使いたかったけど ...
-
-
jQueryでループを抜けようと(breakしようと)するとエラーになる際の対応方法
jQueryでループを抜けようと(breakしようと)すると「Uncaught ...