Lesezeichen zum Scrapen, Pimpen und Hosten von Webseiten

Lesezeichen zum Scrapen, Pimpen und Hosten von Webseiten

di Martin Vögeli -
Numero di risposte: 0

Vorbemerkung: Zwei Beispiele zur Automatisierung von Moodle-Fleissarbeiten:

  • JavaScript zur Extraktion aller verwendenden Tags (Schlagworte) eines Glossars in der Browser-Konsole (Ctrl+Shift+K):
    • let tags = new Set(); document.querySelectorAll('.badge-info').forEach((b) => {tags.add(b.text.trim());}); console.log(tags);
  • JavaScript zur automatischen Bewertung von Glossar-Einträgen mit einem Lernpunkt in der Browser-Konsole (Ctrl+Shift+K):
    • document.querySelectorAll('select').forEach((s) => {if(s.id.includes('menurating')){s.value=1;s.dispatchEvent(new Event('change'));}});

Liefere gerne (auf Wunsch) weitere der in der Session gezeigten Bookmarklets nach ?

? Lesezeichen zum

Scrapen, Pimpen und Hosten

von Webseiten ?


Eigenschaften von Lesezeichen

  • Persönliche (verschlagwortete) Sammlung
  • Schlüsselwort, um in Adressleiste zu öffnen ⭐
  • Synchronisieren mit Firefox, Chrome etc.

Ermöglichen auch Bookmarklets

  • Bestehen aus HTML / CSS und JavaScript (JS)
  • Das heisst, sie ermöglichen private Webseiten ?
  • Können (bei Bedarf) JS-Bibliotheken laden

Scrapen von Webseiten

1. Wir verwenden Great Movies als Beispiel
2. Filmtitel wählen, rechte Maustaste, Untersuchen
3. JS schrittweise in der Konsole entwickeln: 
document.querySelectorAll("h5 a").forEach((a) => /* Continue */ );
4. JS in Bookmarklet-Exoskelett einfügen: 
javascript: (() => { /* JS */ })();
5. Bookmarklet als Lesezeichen hinzufügen ?

Pimpen von Webseiten

Wir verwenden DuckDuckGo als Beispiel

Links durchgehen und YT durch NC ersetzen:

a.href.replace('youtube.com/watch?v=', 'youtube-nocookie.com/embed/')

Oder: Dark Mode für jede Webseite ?

Hosten von Webseiten

1. Ein Bookmarklet für HTML beginnt so: 
data:text/html,
2. HTML-Code für einen minimalen Editor: 
<html contenteditable='true'>
3. Kombiniert wird daraus dieses Bookmarklet: 
data:text/html,<html contenteditable='true'>
Oder: Countdown ohne Tracker / Werbung ⏲️

Ressourcen und Wettbewerb

  • freecodecamp.org/news/what-are-bookmarklets
  • Mit jQuery: mrcoles.com/bookmarklet
  • Danke! Schick mir doch dein Bookmarklet ?
Tag: