jQuery in die JavaScript-Konsole einbinden

Question

Gibt es eine einfache Möglichkeit, jQuery in die JavaScript-Konsole von Chrome für Websites einzubinden, die es nicht verwenden? Ich möchte zum Beispiel auf einer Website die Anzahl der Zeilen in einer Tabelle abfragen. Ich weiß, dass dies mit jQuery wirklich einfach ist.

$('element').length;

Die Website verwendet kein jQuery. Kann ich es über die Befehlszeile hinzufügen?

Answer 1

Wenn Sie jQuery häufig über die Konsole verwenden möchten, können Sie einfach ein Benutzerskript schreiben. Installieren Sie zunächst Tampermonkey, wenn Sie Chrome benutzen, und Greasemonkey, wenn Sie Firefox benutzen. Schreiben Sie ein einfaches Userscript mit einer Use-Funktion wie dieser:

var scripts = [];

function use(libname) {
    var src;
    if (scripts.indexOf(libname) == -1) {
        switch (libname.toLowerCase()) {
            case "jquery":
                src = "//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js";
                break;
            case "angularjs":
                src = "//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js";
                break;
        }
    } else {
        console.log("Library already in use.");
        return;
    }
    if (src) {
        scripts.append(libname);
        var script = document.createElement("script");
        script.src = src;
        document.body.appendChild(scr);
    } else {
        console.log("Invalid Library.");
        return;
    }
}

Answer 2

Hier ist ein alternativer Code:

javascript:(function() {var url = '//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'; var n=document.createElement('script');n.setAttribute('language','JavaScript');n.setAttribute('src',url+'?rand='+new Date().getTime());document.body.appendChild(n);})();

die entweder direkt in die Konsole eingefügt werden können oder eine neue Lesezeichenseite erstellen (in Chrome Rechtsklick auf das Lesezeichen Bar , Seite hinzufügen... ) und fügen Sie diesen Code als URL ein.

Um zu testen, ob das funktioniert, siehe unten.

Vorher:

$()
Uncaught TypeError: $ is not a function(…)

Danach:

$()
[]

Answer 3

Wenn Sie dies für ein Benutzerskript tun wollen, habe ich dies geschrieben: http://userscripts.org/scripts/show/123588

Damit können Sie jQuery, UI und alle Plugins, die Sie möchten, einbinden. Ich benutze es auf einer Website, die 1.5.1 und keine UI hat; dieses Skript gibt mir stattdessen 1.7.1, plus UI, und keine Konflikte in Chrome oder FF. Ich habe Opera nicht selbst getestet, aber andere haben mir gesagt, dass es bei ihnen auch funktioniert hat, also sollte dies eine ziemlich vollständige, browserübergreifende Userscript-Lösung sein, falls Sie das brauchen.

Answer 4

Schlüsselfertige Lösung :

Setzen Sie Ihren Code in yourCode_here Funktion. Und verhindern Sie HTML ohne HEAD-Tag.

(function(head) {
  var jq = document.createElement('script');
  jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js";
  ((head && head[0]) || document.firstChild).appendChild(jq);
})(document.getElementsByTagName('head'));

function jQueryReady() {
  if (window.jQuery) {
    jQuery.noConflict();
    yourCode_here(jQuery);
  } else {
    setTimeout(jQueryReady, 100);
  }
}

jQueryReady();

function yourCode_here($) {
  console.log("OK");
  $("body").html("<h1>Hello world !</h1>");
}

Answer 5

Intuitiver Einzeiler

document.write(unescape('%3Cscript src="https://code.jquery.com/jquery-3.1.1.min.js"%3E%3C/script%3E’))

Sie können die src Adresse.
Ich bezog mich auf ReferenzFehler: Variable kann nicht gefunden werden: jQuery