| Bookmarklets bieten die wenig bekannte Möglichkeit, kleine Javascript-Programme als Bookmarks zu speichern. | Die betreffenden Programme können so auf alle (!), d.h. auch auf fremde Webseiten, angewendet werden ! |
| Achtung: Die Anwendung der hier gezeigten Links & Bookmarklets erfolgt auf ihr eigenes Risiko ! | |
 Javascript
|
ECMAScript für HTML und XML |
| Bookmarklets | Wenig bekannt, aber einfach erklärt |
| Speichern | Wie speichert man ein Bookmarklet ? |
| Programmierung | Wie erstellt man eigene Bookmarklets ? |
| Beispiele | Einige Beispiele für Werkzeug-Bookmarklets |
| Links |
Ausgewählte 
Links zum Thema Bookmarklets
|
Bookmarklets |
|
|
Bookmarks - Lesezeichen - Favoritten
Jeder übliche Browser bietet die Möglichkeit, die Adresse einer besuchten
Webseite als Bookmark zu speichern.Wenn sie ein gespeichertes Bookmark aus ihrer Liste abrufen, dann wirkt dieser Befehl genauso wie das Anklicken eines entsprechenden Links auf der gerade angezeigten Webseite. Mit HTML-Links können sie nicht nur Webseiten öffnen, sondern auch Javascript-Programme ausführen. |
Übliche Links haben diese HTML-Form:
<a href="http://pstrainer.topsoft.at">
</a>
An Stelle einer Webseite kann jedoch auch ein Javascript-Programm aufgerufen werden.
Kleine Javascript-Programme können komplett im Link enthalten sein:
<a href="javascript:alert('JS-Programm')">
</a>
|
| Wenn sie nicht einen üblichen WebLink als Bookmark speichern, sondern ein kleines JS-Programm, dann wird dieses Programm auf die gerade angezeigte Webseite angewendet. | Nach diesem Pronzip funktionieren Bookmarklets: DEas sind kleine JS-Programme, die sie als Bookmark speichern und danach auf jede (!) Webseite anwenden können. |
Speichern von Bookmarklets |
|
|
Die Handhabung von Bookmarks (Lesezeichen, Favoriten) ist bei jedem Browser anders gelöst. Klären sie daher zuerst, wie Bookmarks auf ihrem Browser erstellt und geändert werden. |
Die meisten Browser bieten die Möglichkeit, Links aus Webseiten direkt in die Bookmark-Liste aufzunehmen. Dazu rechtsklicken sie einen Link und geben entsprechende Kontext-Befehle. |
|
Beispiel M$IE (Version 6, de):
Menübefehl Favoriten | Favoriten verwalten.Das Fenster "Organize Favorites" wird angezeigt. Markieren sie ein Bookmark aus der angezeigten Liste. Mit Rechtsklick gelangen sie zu den Eigenschaften Register "Allgemein" zeigt den Namen, unter dem das Bookmark in ihrer Liste aufscheint. Register "Web Document" zeigt unter URL die Adresse der Webseite -> hierher kopieren sie ein Bookmarklet. Leider bietet M$IE keine Möglichkeit, ein leeres Bookmark neu anzulegen. Sie können jedoch ein beliebiges "Webseiten-Bookmark" neu anlegen und es nachher verändern. |
Beispiel Mozilla (Version 1.6):
Menübefehl Bookmarks | Manage Bookmarks.Das Fenster "Bookmark Manager" wird angezeigt. Markieren sie ein Bookmark aus der angezeigten Liste. Mit Rechtsklick gelangen sie zu den Eigenschaften (Properties) Register "Info" zeigt Name und "Location". Name ist der Name, unter dem das Bookmark in ihrer Liste aufscheint. Location ist die Adresse der Webseite: -> hierher kopieren sie ein Bookmarklet. Im Bookmark Manager können sie mit Menübefehl File | New | Bookmark neue leere Bookmarks anlegen. |
|
Beispiel: Bookmark mit
Rechtsklick anlegen.
|
|
|
Auf Bookmarklet-Webseiten finden sie meist auch die Möglichkeit,
Bookmarklets bequemer zuspeichern: ● Rechtsklicken sie den oberhalb gezeigten Link und geben sie einen entsprechenden Kontext-Befehl (Add to Favorites, Bookmark this Page, ...) |
Fehler: Wenn sie den Link der rechten Spalte Linksklicken, dann
wird das JS-Programm zwar ausgeführt, jedoch nicht als Bookmarklet gespeichert ! Warnung: Manche Browser geben Warnungen ab, wenn sie Bookmarklets speichern. Das ist lächerlich, weil die Mehrzahl aller Webseiten Javascript-Programme enthält, vor denen sie normalerweise nicht gewarnt werden. |
|
Text eines Muster-Bookmarklets:
javascript:alert('Bookmarklet !')
|
|
|
●
Erzeugen sie ein neues, leeres Bookmark, z.B. unter dem Namen "BookmarkTest". ● Kopieren sie den oberhalb stehenden Text eines Muster-Bookmarklets. ● Setzen sie den Text in ihr Bookmark ein. (dort, wo sonst die Adresse der Webseite steht). |
●
Ihr Bookmarklet sollte nun in der Bookmark-Liste ihres Browsers aufscheinen. ● Sie können es auf jede (!) geöffnete Webseite anwenden. |
|
Beim M$IE Browser können sie ein Bookmarklet zusätzlich
in das Kontextmenü (Rechtsklick-Menü) eintragen: Anleitung von ct(Heise-Verlag) |
Mozilla (Netscape) bietet den Icon-bar "Bookmarks Toolbar Folder". Im Bookmarks Manager lässt sich jeder Link dorthin kopieren oder verschieben. Ein Bookmarklet-Link steht so als klickbarer Button zur Verfügung. |
Programmierung von Bookmarklets |
|
|
►
Bookmarklets sind in der Programmiersprache Javascript
verfasst, daher gelten deren allgemeine Regeln. ► Bookmarklets dürfen keine Füllzeichen (Leerzeichen, Tabulatoren oder Zeilenschaltungen) enthalten, wie sie zur besseren Gliederung verwendet werden. Da diese "Einzeiler" in dieser Form kaum lesbar sind, müssen sie die Scripts zuerst in einer "Debug"-Form entwickeln, dann die Füllzeichen entfernen. ► Variable: Die Namen sollen kurz sein, dürfen aber keinesfalls mit den Variablen-Namen einer beliebigen (!) Webseite konkurrieren. ► Kommentare weglassen. ► Programmieren sie unabhängig von Browsern und Versionen. Falls das nicht möglich ist, verzweigen sie im Programm. |
►
Rückgabe: Ein Bookmarklet darf keinen Wert an die Webseite
"zurückgeben". Befehl void() liefert stets den
Wert undefined und wird daher als letzter Befehl des
Bookmarklets eingesetzt. ► Einfache und doppelte Anführungszeichen: Da noormalerweise der gesamte Link in "double quotes" steht, können sie nur 'single quotes' oder quotes als Sonderzeichen \" bzw. \' in den scripts verwenden. ► Rahmen (frames): Ein Bookmarklet wird auf die jeweils angezeigte Webseite angewendet - wenn das eine Rahmenseite ist, dann erfahren sie nichts über die Seiten in den Rahmen. Sie können Bookmarklets so programmieren, dass sie auf die einzelnen Webseiten wirken, oder die Webseiten zuerst in einem eigenen Fenster öffnen. |
|
Ausgabe: Zum Anzeigen von Informationen wird meistens ein
Alarmfenster oder das Statusfeld verwendet. Ein Alarmfenster funktioniert auf allen Browsern, kann aber bei oftmaliger Wiederholung lästig sein. Die Statuszeile nervt nicht, eignet sich besonders für die Auslösung durch onmouseover-Ereignisse. Auch das Einfügen von DOM-Knoten ist möglich, am besten als erstes oder letztes child des <body>-Elements, weil dieses auf jeder Webseite vorkommt. Umfangreiche Ausgabetexte bringt man besser auf einer neuen Webseite unter. Die Methode open().document ohne Parameter liefert ein neues leeres Fenster. |
// Alarmfenster
alert('Ausgabe eines Alarmfensters');
// Statuszeile
status='Ausgabe in der Statuszeile'
// DOM-Knoten
mynode=document.getElementsByTagName("body");newnode=document.createElement("div"); newtxt=document.createTextNode('Ausgabe als neuer DOM-Knoten'); newnode.appendChild(newtxt); mynode.insertBefore(newnode,mynode.firstChild);
<body>
Inhalt der Webseite
<body>
|
Beispiele von Bookmarklets |
|
| Bookmarklets eignen sich als universelle Werkzeuge, die sich auf alle Webseiten anwenden lassen. Sie sind daher interessant, um zusätzliche Informationen über Webseiten zu erhalten, oder um deren Aussehen zu verändern. | Alle Beispiele werden als Links angeboten. Wenn sie den JS-Quelltext ansehen wollen, dann kopieren sie einen Bookmarklet-Link und setzen den Text an beliebiger Stelle ein (z.B. in jeden Text-Editor). |
| Hinweis: Manche Bookmarklets laufen unterschiedlich, teilweise oder fehlerhaft, je nach Browser & Version. | |
|
Informationen über Webseiten:
Anker <a name="..."></a> sichtbar machen
CSS-Klassen einer Webseite anzeigen.
Unsichtbare Formularfelder anzeigen.
oder
HTML-Quelltext einer Webseite anzeigen
JS-Fehler im Statusfeld des Browsers anzeigen
Links einer Webseite anzeigen
Bilder einer Webseite anzeigen
Javascript-Blöcke anzeigen.
|
Änderung des Aussehens & Verhaltens von Webseiten:
CSS-Stylesheets abschalten
Plugins abschalten (Flash, Java, Musik, ...)
Event-Handler abschalten (Popups, ...)
Zeitgeber abschalten
oder
Kontextmenü (Rechtsklick) wiederherstellen
Bilder vergrößern
Bilder verkleinern
|
|
Einige Websites (Suchmaschinen, ...) bieten Bookmarklets an: Dabei werden Such-Texte nach
ihren Angaben zusammengestellt:
Excite Suche
Altavista Suche
Lycos Suche
|
LEO (Wörterbuch de - en)
|
Die meisten Sites enthalten selbst einige BookMarklets
|
|
|
Bookmarklets.com,
Gibney,
Krapplack,
Squarefree,
Stichpunkt, Webreference - mehrteiliger Kurs, Webcite, Whois, Bookmarklet Builder |
Wikipedia: Bookmarklet,
Bookmarklets ! für die Wikipedia-Suche nach markierten Begriffen
(
Firefox, Opera,
M$IE,
Safari)
|
