1. ホーム
  2. javascript

[解決済み] JavaScriptコンソールにjQueryを含める

2022-03-17 10:07:57

質問

jQueryを使用していないサイトで、ChromeのJavaScriptコンソールにjQueryを簡単に含める方法はありますか?例えば、あるウェブサイトで、テーブルの行数を取得したいと思います。これはjQueryを使えばとても簡単なことだと知っています。

$('element').length;

jQueryを使用していないサイトです。コマンドラインから追加することはできますか?

解決方法を教えてください。

ブラウザのJavaScriptコンソールでこれを実行すると、jQueryが利用可能になるはずです。

var jq = document.createElement('script');
jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js";
document.getElementsByTagName('head')[0].appendChild(jq);
// ... give time for script to load, then type (or see below for non wait option)
jQuery.noConflict();

NOTE サイト内にjQueryと競合するスクリプト(他のライブラリなど)がある場合、問題が発生する可能性があります。

更新情報

最高のものをより良くする、Bookmarkを作ると本当に便利になる、やってみよう、ちょっとしたフィードバックも嬉しい。

  1. ブックマーク・バーを右クリックし ページの追加
  2. 名前はInject jQueryなど好きな名前にして、URLは以下の行を使用します。

javascript:(function(e,s){e.src=s;e.onload=function(){jQuery.noConflict();console.log('jQuery injected')};document.head.appendChild(e);})(document.createElement('script'),'//code.jquery.com/jquery-latest.min.js')

以下は、フォーマットされたコードです。

javascript: (function(e, s) {
    e.src = s;
    e.onload = function() {
        jQuery.noConflict();
        console.log('jQuery injected');
    };
    document.head.appendChild(e);
})(document.createElement('script'), '//code.jquery.com/jquery-latest.min.js')

ここでは、jQueryの公式CDN URLを使用していますが、ご自分のCDN/バージョンをご自由にお使いください。