50
47

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

ページのJavaScriptを動的に書き換えて実行する

Posted at

DevToolsで動的にページのJavaScriptを書き換えて実行できるのを数ヶ月前まで知らなかったのでメモ。

dynamic-compile.gif

上のGIFでは、DevToolsのSourcesタブから、ページ内で読み込まれているJavaScriptのファイルを選択して、onkeydownで呼ばれる関数の中を書き換えて、⌘ + sで保存してる。そのあとtextareaに文字を入力すると、書き加えたコード(ここで追加してるのはconsole.logね)が実行されて、文字列が下部のConsoleに出力されてるのがわかる。


ちなみに、1行目にブレークポイントを置いて停止している間に書き換えることもできる。当然、全部削除して保存すると何も実行されなくなる。


HTTPSでローカルプロキシしにくいページとかでデバッグするのに便利かなーと思った。

50
47
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
50
47

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?