2014-09-29

jQueryを一時的にページに読み込ませる

jQuery便利ですよね。
色々な動きあるページは根底でこれが動いていることが多々あるわけですが、jQueryが導入されていないページでHTML上の構造をチェックしたりしたい場合に仕えたほうが便利なケースがあります。

そういうときには、ブラウザコンソール上から一時的にjQueryをロードしてしまうことで気軽に検証することができます。




jQueryの動的ロード

これには、 Google Developersが公開しているjQueryを指定するのがお手軽です。

①まず、jQueryを読み込ませたいページをブラウザで開きます。


②次に、ブラウザの「JavaScriptコンソール」を表示します。

これは、主要ブラウザであれば大体「F12」キーを押して開発ツールウィンドウから表示させることができます。(Chrome、FireFox、IE11で確認しました)

③次のコードをコンソールウィンドウに貼り付けてエンターキーを押下します。





以上です。うまく読み込まれていれば上記のような形になります。(Chrome)

動作確認

jQueryの命令をコンソールに入力してみましょう。
例えば、ページ全体のaタグを全部取ってみます。



うまくいきました。
導入前のチェックに役立つと思います。