jQueryでユーザーが編集可能な文字列をページ上に表示する際にエスケープする方法
GETパラメータを取得し、その内容をページ上に表示したいケースがあった。また、ASPを利用したサイトのためPHPが利用不可だった。かといってjQueryのhtml()で出力するとJSのalertとかがそのまま実行されてしまうため危険っぽい。そのためjQueryでエスケープしつつ表示する方法をメモ。
対応方法
ソースコード
//GETパラメータが入る変数
const param = 'xxxxx';
//これだとアウト(alertが実行された)
$(`.sample`).html(`${param}`);
//これだとセーフ(alertが実行されなかった)
$(`.sample`).text(`${param}`);
JavaScriptの場合
innerHTMLでもscriptタグが直接入力されている場合は実行されないらしい。実際に試してみたところ実行されなかった。
関連記事
-
-
エリア→都道府県→路線→駅名を連携する絞り込みセレクトメニューの設置方法
エリア→都道府県→路線→駅名のドリルダウン検索をプルダウン形式で設置したい。以前 ...
-
-
「jQuery.browser is undefined」エラーの対応方法
jQueryのプラグインを使っていて1.9以降だと「jQuery.browser ...
-
-
tableのtd内にあるcheckboxのクリック範囲を拡大させ、チェック時に親要素であるtdにCSSを割り当てる方法
tableのtd内にcheckboxを設置し、td部分をクリックすることでche ...
-
-
FlashとjQueryを組み合わせたプラグインでWebカメラで撮影した画像をアップロード
FlashとjQueryを組み合わせたプラグインを用いてWebカメラで撮影した画 ...
-
-
jQueryプラグインでクリップボードにコピーする方法(clipboard.js)
ページ上のボタンをクリックすることで特定の文章をクリップボードにコピーしたかった ...