勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

jQueryでユーザーが編集可能な文字列をページ上に表示する際にエスケープする方法

  jQuery JavaScript

GETパラメータを取得し、その内容をページ上に表示したいケースがあった。また、ASPを利用したサイトのためPHPが利用不可だった。かといってjQueryのhtml()で出力するとJSのalertとかがそのまま実行されてしまうため危険っぽい。そのためjQueryでエスケープしつつ表示する方法をメモ。

 

対応方法

ソースコード

//GETパラメータが入る変数
const param = 'xxxxx';

//これだとアウト(alertが実行された)
$(`.sample`).html(`${param}`);

//これだとセーフ(alertが実行されなかった)
$(`.sample`).text(`${param}`);

JavaScriptの場合

innerHTMLでもscriptタグが直接入力されている場合は実行されないらしい。実際に試してみたところ実行されなかった。

 - jQuery JavaScript

  関連記事

要素の点滅

やりたかった事はaタグ内で囲まれている部分を点滅。 <blink>だ ...

オリジナルのjQueryプラグインを作成する方法

オリジナルのjQueryプラグインを作ってみたかった。というのも大抵のものはググ ...

jQueryでiframe内の要素を呼び出し

jQueryでiframeで開いたbody内の内容が欲しかった。 ■jQuery ...

javascriptやjQueryで画像を書き換えても変わらない場合

けっこう前に画像をアップロードしてリアルタイムにプレビューする機能を作った時に、 ...

CAPTCHAに代わる無料のツール「Cloudflare Turnstile」の導入方法

CAPTCHAと言えばGoogleのreCAPTCHAを思い浮かべるが、稀にCl ...