Hier im Forum bekommt ihr bei euren fragen schnelle hilfe.Hier geht es rund um das Web SeitenProgrammieren.Alles rund ums Javascript,Html,Php,Css und Sql.Auf fast allen Fragen haben wir eine Antwort.
Der Soforthilfe-chat verspricht das ,was sein Name sagt. Hier sind Leute Online die sofort ihre hilfe anbieten.Seht in der OnlineListe nach und wenn einer Online ist werdet ihr auch antwort bekommen. Admine ,Moderatoren und Helfer sind unsere Spezialisten in Sachen Web Programierung
71 Unwetterwarnungen in Deutschland
Die Datenbank wurde zuletzt am 02.08.2020 17:34:28 aktualiesiert
71

Das Handbuch mit den vollständigen Benutzerskripten

Erfahren Sie, wie Sie Benutzerskripte einrichten, suchen, verwenden und sogar schreiben, um Ihr Surferlebnis zu verbessern und Ihre Online-Produktivität zu steigern, indem Sie das Erscheinungsbild ändern und Webseiten Funktionen hinzufügen oder ändern.

Einführung

Haben Sie sich jemals gefragt, ob Sie die nächste Seite laden können, wenn Sie das Ende einer Webseite erreichen? Oder fügen Sie möglicherweise Quicklinks und Informationen von externen Seiten hinzu (z. B. Faulen Tomaten hinzufügen und auf die IMDb-Seite eines Films verlinken)?

Benutzerskripte können all diese Fragen beantworten.

Endloses Google
Rottentomaten-Messgerät anzeigen

Ein Benutzerskript besteht aus einer Reihe von JavaScript-Code und Metadaten, die beim Laden einer Webseite ausgeführt werden:

  • Der Code ist eine Folge von Anweisungen, die dem Browser mitteilen, wie die Seite geändert werden soll.
  • Die Metadaten sind Informationen zum Benutzerskript, z. B. die Webseiten, auf denen sie ausgeführt werden sollen, die benötigten Ressourcen und Bibliotheken und vieles mehr.
UserScript = Code + Metadaten

Zum Hinzufügen, Aktualisieren und Verwalten von Benutzerskripten muss ein Benutzerskript-Manager installiert sein.

Technisch gesehen ist ein Benutzerskript nur eine Textdatei, die mit endet .user.js. Auf diese Weise können Userscript-Manager Benutzerskripte erkennen und installieren, wenn eine Datei im Browser geöffnet wird.

Installieren eines Userscript Managers

Nach meiner Erfahrung eignet sich Tampermonkey am besten für Chromium-basierte Browser wie Google Chrome und Opera.

Violentmonkey ist derzeit der am besten unterstützte UserScript-Manager für Firefox.

Tampermonkey

Mit mehr als 10 Millionen Benutzern ist Tampermonkey der führende UserScript-Manager. Es ist auch in allen wichtigen Navigatoren verfügbar.

Tampermonkey

Hier sind die direkten Seiten, auf denen Sie die Tampermonkey-Erweiterung installieren können:

Ausführlichere Anweisungen zur Installation von Tampermonkey und eine umfassende Funktionsübersicht finden Sie unter den folgenden Links: Google Chrome , Opera , Microsoft Edge , Safari .

Gewalttätiger Affe

Violentmonkey ist die Hauptalternative zu Tampermonkey und vollständig Open Source . Es ist in Firefox, Chrome, Opera und Maxthon verfügbar.

Gewalttätiger Affe

Auf der folgenden Seite werden die Download-Links für die verschiedenen unterstützten Browser aufgelistet: https://violentmonkey.github.io/get-it/

Fettaffe

Greasemonkey ist der ursprüngliche UserScript-Manager. Nach Firefox 57 und ab der Version Greasemonkey 4 wurde die API der Erweiterung so geändert, dass sie mit der Browser-Erweiterungs-API kompatibel ist. Skripts, die mit der älteren GM_synchronen API geschrieben wurden, werden nicht mehr unterstützt (weitere Erläuterungen finden Sie in diesem Blogbeitrag ).

Ich rate momentan davon ab, es zu verwenden, da die meisten Benutzerskripte mit der älteren API geschrieben wurden und die anderen Benutzerskript-Manager die neue asynchrone API nicht unterstützen.

Sie müssen es nur installieren, wenn ein Benutzerskript, das Sie hinzufügen möchten, speziell unter Verwendung der neuen GM.asynchronen API geschrieben wurde und keine Polyfüllung zur Unterstützung der älteren API enthält (sehr selten).

Suchen nach Benutzerskripten

Die meisten Benutzerskripte werden entweder auf openuserjs.org oder greasyfork.org gehostet.

OpenUserJS

Das folgende Beispiel zeigt, wie Sie in OpenUserJS nach einem Benutzerskript suchen und es mit Tampermonkey in Google Chrome installieren:

  1. Navigieren Sie zur Homepage
  2. Geben Sie die Schlüsselwörter in die Search UserscriptsTexteingabe ein: Dies kann der Name der Zielwebsite, die gewünschte Funktion usw. sein. Lassen Sie uns beispielsweise nach einem Google-Benutzerskript suchen
  3. Öffnen Sie beispielsweise die zu installierende Skriptseite Endless Google
  4. Wenn die Beschreibung des Skripts den gesuchten Funktionen entspricht, installieren Sie das Skript, indem Sie auf die InstallSchaltfläche klicken
  5. Bestätigen Sie die Installation mit einem Klick auf Install
  6. Das Benutzerskript kann jetzt durch Öffnen oder erneutes Laden der Zielwebsite getestet werden

GreasyFork

Firefox mit Violentmonkey wird in den nächsten Schritten verwendet:

  1. Navigieren Sie zur Seite "Skripte"
  2. Geben Sie die Schlüsselwörter in die Search scriptsTexteingabe ein: Dies kann der Name der Zielwebsite, die gewünschte Funktion usw. sein. Lassen Sie uns beispielsweise nach einem Feedly-Benutzerskript suchen
  3. Öffnen Sie beispielsweise die zu installierende Skriptseite Feedly filtering and sorting
  4. Wenn die Beschreibung des Skripts den gesuchten Funktionen entspricht, installieren Sie das Skript, indem Sie auf die Install this scriptSchaltfläche klicken
  5. Bestätigen Sie die Installation
  6. Das Benutzerskript kann jetzt durch Öffnen oder erneutes Laden der Zielwebsite getestet werden

Alternativen

  • Userscripts.org war früher das führende User-Script-Repository. Die Website wurde jedoch 2014 geschlossen und eine Spiegel-Webseite wurde gestartet, auf der alle ursprünglichen Benutzerskripte gehostet wurden: userscripts-mirror.org

  • Es gibt einige Benutzerskripte, die auf persönlichen oder github-Seiten gehostet werden. In diesem Fall kann eine allgemeine Suchmaschine wie Google verwendet werden, um nach ihnen zu suchen.


OpenUserJS - 1) Startseite
Suchen Sie unter OpenUserJS nach einem Benutzerskript, indem Sie die Schlüsselwörter auf der Homepage eingeben
OpenUserJS - 2) Ergebnisseite
Öffnen Sie die zu installierende Skriptseite
OpenUserJS - 3) Skriptseite
Installieren Sie das Skript
OpenUserJS - 4) Installationsbestätigung
Bestätigen Sie die Installation. Das Benutzerskript kann jetzt getestet werden.
GreasyFork - 1) Skriptseite
Suchen Sie in GreasyFork nach einem Benutzerskript, indem Sie die Schlüsselwörter auf der Seite "Skripts" eingeben
GreasyFork - 2) Suchergebnisseite
Öffnen Sie die zu installierende Skriptseite
GreasyFork - 3) Skriptseite
Installieren Sie das Skript
GreasyFork - 4) Bestätigen Sie die Installation
Bestätigen Sie die Installation. Das Benutzerskript kann jetzt getestet werden.

Benutzerskripte verwenden

Ein Benutzerskript kann nach der Installation auf verschiedene Arten konfiguriert und bearbeitet werden:

Der Userscript-Manager kann auch zum Konfigurieren von Sicherheits-, Speicher- und anderen skriptspezifischen Einstellungen verwendet werden, z. B. den Seiten, auf denen das Skript ausgeführt werden soll, wie im folgenden Abschnitt dargestellt.

Schließt ein und schließt aus

Die Includes / Matches sind die Webseiten, auf denen das Skript ausgeführt wird (@ include unterstützt reguläre Ausdrücke und @ match ist sicherer). Die Ausschlüsse sind die Seiten, auf denen das Skript nicht ausgeführt werden sollte.

Obwohl das Benutzerskript bereits Einschlüsse und Ausschlüsse in den Metadaten definiert, können diese mit dem Benutzerskript-Manager überschrieben werden.

Tampermonkey

  1. Öffnen Sie das Dashboard, indem Sie auf die Schaltfläche Tampermonkey klicken und auswählen Dashboard
    Schließt ein und schließt aus - Tampermonkey - 1
  2. Klicken Sie auf das Benutzerskript, das Sie konfigurieren möchten
    Schließt ein und schließt aus - Tampermonkey - 2
  3. Wechseln Sie zur SettingsRegisterkarte. Sie können jetzt zusätzliche Einschlüsse, Übereinstimmungen und Ausschlüsse hinzufügen. Sie können auch die ursprünglichen Einschlüsse und Ausschlüsse deaktivieren
    Schließt ein und schließt aus - Tampermonkey - 3

Gewalttätiger Affe

  1. Öffnen Sie das Dashboard, indem Sie auf die Schaltfläche Violentmonkey klicken und auswählen Open Dashboard
    Beinhaltet und schließt aus - Violentmonkey - 1
  2. Klicken Sie auf die Schaltfläche Bearbeiten neben dem Benutzerskript, das Sie konfigurieren möchten
    Beinhaltet und schließt aus - Violentmonkey - 2
  3. Wechseln Sie zur SettingsRegisterkarte. Sie können jetzt zusätzliche Einschlüsse, Übereinstimmungen und Ausschlüsse hinzufügen. Sie können auch die ursprünglichen Einschlüsse und Ausschlüsse deaktivieren
    Beinhaltet und schließt aus - Violentmonkey - 3

Beispiele für Benutzerskripte

Hier ist eine Liste der in diesem Handbuch vorgestellten Benutzer-Skripte, die ich persönlich sehr nützlich finde:

Schreiben Sie Ihre eigenen Skripte

Voraussetzungen

Grundlegende HTML-Kenntnisse sind erforderlich. Erste Schritte mit HTML .

Grundlegende CSS-Kenntnisse sind ebenfalls erforderlich, insbesondere Selektoren. Lassen Sie sich bei CSS-Selektoren vorstellen .

Wenn Sie mit JavaScript nicht vertraut sind, empfehle ich, die folgenden Anleitungen für die ersten Schritte zu lesen .

Wenn Sie bereits mit JavaScript vertraut waren und eine Auffrischung benötigen oder nur ein zusammengefasstes Lernprogramm benötigen, um die Sprache schnell zu erlernen, finden Sie hier eine erneute Einführung in JavaScript

Sie können auch den Kapiteln dieses JavaScript-Handbuchs für Fortgeschrittene folgen und diese ausführliche JavaScript-Referenz lesen .

Ihr erstes Benutzerskript

Wie bereits erwähnt, besteht ein Benutzerskript aus einem Satz von JavaScript-Code und Metadaten, die technisch gesehen nur JavaScript-Kommentare sind.

Klicken Sie im UserScript Manager-Dashboard auf die +Schaltfläche, um ein neues UserScript zu erstellen.

Erstellen Sie ein neues Benutzerskript

Ändern Sie den Namen, die Beschreibung und das Übereinstimmungsmuster, um eine bestimmte Webseite als Ziel festzulegen. Ersetzen // Your code here... durchalert('Hello World !');

Hallo Weltnutzerskript

Navigieren Sie jetzt zu Ihrer Zielwebsite oder aktualisieren Sie sie, falls sie bereits geöffnet ist. Es sollte eine Warnmeldung angezeigt werdenHello World

Hallo Welt Benutzer Skriptausführung

Das ist es!

Sie können jetzt mit der GM_*API experimentieren , um beispielsweise Daten zu speichern, oder Codebibliotheken von Drittanbietern (z. B. JQuery) hinzufügen, um weniger Code zu schreiben oder vorhandenen Code wiederzuverwenden.

Verwenden der API und Hinzufügen externer Bibliotheken

Wenn Sie die verwenden mögen GM_*API, müssen Sie einen deklarieren - @grant Header in dem von dem API - Funktionsnamen (wie gefolgt von Metadaten GM_getValue, GM_setValueetc.)

// @grant       GM_setValue

// @grant       GM_getValue
Kopieren

Eine User-Script-Dokumentation, die die verfügbaren Header (Metadaten) und die API ( GM_*) beschreibt, finden Sie auf der folgenden Seite . Eine alternative Metadatendokumentation finden Sie hier .

Bibliotheken von Drittanbietern können hinzugefügt werden, indem der @requireHeader gefolgt von der Bibliotheks-URL definiert wird. Zum Beispiel:

// @require     https://code.jquery.com/jquery-3.2.1.min.js

User Script-Idiome und Code-Schnipsel

  • Fragen Sie ein Seitenelement ab und entfernen Sie es:
    document.querySelector("#element_id").remove()
    
    ;
  • Speichern Sie ein Objekt:
    GM_setValue("MY_OBJECT_KEY", JSON.stringify(myObject)
    
    );
  • Objekt abrufen:
    var myObject = JSON.parse(GM_getValue("MY_OBJECT_KEY"
    
    , "{}"))
    
    ;
  • Ersetzen Sie die aktuelle URL und leiten Sie die Seite weiter:
    var link = document.URL.replace("domain.fr",
    
     "domain.com");
    
    window.location.href=link;
  • Fügen Sie eine Schaltfläche hinzu, um eine Funktion auf der Seite auszuführen:
    var btn = document.createElement("button");
    
    btn.innerHTML = "My button";
    
    btn.onclick = () => {
    
        alert("My button clicked !");
    
        return false;
    
    };
    
    document.querySelector("btn_predecessor_selector").after(btn);
  • Hänge einen Stil an die Seite an:
    var css = "h1 { background: red; }"
    
    var style = document.createElement("style");
    
    style.type = "text/css";
    
    style.appendChild(document.createTextNode(css));
    
    document.head.appendChild(style);
  • Externe Seite abrufen und analysieren:
    fetch("http://example.com/path-name")
    
    .then(response => response.text())
    
    .then(text => {
    
        var parser = new DOMParser();
    
        var htmlDocument = parser.parseFromString(text, "text/html");
    
        var content = htmlDocument.documentElement.querySelector("element_selector");
    
        alert("My fetched element content: " + content.textContent);
    
    });

Add Comment

* Required information
1000
Powered by Commentics

Comments (0)

No comments yet. Be the first!