BookmarkletsWebsite-Manipulator
Javascript-Boormarks
Bookmarklets
Bookmarklets, auch Favelets genannt, sind eine tolle Sache. Mit ihnen lassen sich nicht nur lästige HTML- und CSS-Elemente entfernen, sondern ganze Webseiten verändern und mit nützlichen Zusatzfunktionen ausstatten. Sie stellen daher ein mächtiges Instrument in der Hand des Anwenders dar. Es handelt sich dabei um Javascript-Anweisungen, die direkt als Bookmark abgespeichert werden, und von dort aus mit einem Klick aufgerufen werden. Ihr einziges Handicap besteht darin, dass sich die Ausführung des Skripts immer nur auf das jeweils angezeigte Dokument bezieht, weshalb sie in Frames oft Probleme bereiten.
Um ein Skript aufzurufen, brauchen Sie lediglich die Favoriten- beziehungsweise Bookmark-Liste des Browsers zu öffnen und dort das gewünschte Bookmarklet auszuwählen. Im MS Internet Explorer 6 sind Bookmarks leider auf 508 Zeichen beschränkt.
Beim Schreiben oder Verändern von Bookmarklets müssen Sie darauf achten, dass alles in einer Zeile steht, also der Code keine Zeilenumbrüche oder Tabs aufweist. Alle Bookmarklets werden mit dem Keyword javascript eingeleitet.
Seite lesbar machen
Bookmarklets
Das folgende einfache Bookmarklet ist dann nützlich, wenn eine Seite auf Grund der Farbgestaltung nicht oder nur schwer lesbar ist. Es färbt den Hintergrund der aktuellen Seite weiß und die Schriftfarbe schwarz. Ein eventuell vorhandenes Hintergrundbild wird entfernt:
javascript: b = document.body.style;
void(b.background = '');
void(b.backgroundColor = 'white');
void(b.color = 'black');
Dem void-Operator begegnen Sie in Bookmarklets recht häufig. Er verhindert, dass der Browser den Rückgabewert der Anweisung anzeigt. Mit void können Sie also diesen unangenehmen Nebeneffekt unterbinden.
Die Anweisungen setzen die bekannten Attribute für den Vorder- und Hintergrund auf die erforderlichen Werte. Das Bookmarklet funktioniert allerdings nur, wenn sich die ursprünglichen Angaben ? wie häufig üblich ? im body-Tag befinden. Wird die Farbgestaltung mit Hilfe von zentralen Stylesheet-Angaben erreicht, muss das Stylesheet geändert oder gelöscht werden.
Beliebiges Element entfernen
Bookmarklets
Als sehr wirksam, um nervige Inhalte loszuwerden, erweist sich das nächste Skript. Wenn Sie dieses Bookmarklet aktivieren, wird jedes angeklickte Element auf der aktuellen Seite entfernt. Auf diese Weise können Sie störende Elemente aller Art, die direkt in die Seite eingebunden sind, sofort zum Verschwinden bringen:
javascript: void(document.onmousedown = function(e) {
var el = e?e.target:event.srcElement;
el.parentNode.removeChild(el);
})
Um den Klick, bevor er ausgeführt wird, rechtzeitig abzufangen, sollten Sie den Event-Handler onmousedown</i< verwenden. Der Klick wird dann mit dem Event-Objekt ermittelt. Mit der Eigenschaft target beziehungsweise srcElement bestimmen Sie das Element, bei dem der Event stattfindet. Dieses löscht sich schließlich mit Hilfe der Methode removeChild() selbst.
Wie Sie sehen, brauchen Sie der Funktion nicht unbedingt einen Namen zu geben. So genannte anonyme Funktionen, die mit dem Operator () sofort ausgeführt werden, finden in Bookmarklets vielfache Verwendung. Um Wechselwirkungen mit gleichnamigen Variablen im Dokument zu vermeiden, sollten Sie ? wenn möglich ? Variablen innerhalb von Funktionen mit dem Keyword var deklarieren. Diese sind dann nur in der Funktion gültig.
Soll die Maustaste im aktuellen Dokument anschließend wieder wie gewohnt verwendet werden, müssen Sie den Event-Handler wieder aufheben. Im Normalfall werden Bookmarklets einfach beim Neuladen der Seite außer Kraft gesetzt. Da es hier aber nicht sinnvoll ist, die Seite neu zu laden, weil dann ja die weggeklickten Elemente erneut erscheinen, verwenden Sie dafür am besten ein eigenes Bookmarklet:
javascript: void(document.onmousedown = null);
Formular benutzbar machen
Bookmarklets
Das nächste Bookmarklet macht Eingabebereiche, deren Status auf
»nur lesen« gesetzt sind, oder als unbenutzbar deklarierte Formularelemente wie Buttons, Textfelder und Auswahllisten nach einem Klick auf das Bookmarklet sofort benutzbar:
javascript: (function() {
var x, k, f, j;
x = document.forms;
for(k = 0; k < x.length; ++k) {
f = x[k];
for(j = 0; j < f.length; ++j) {
f[j].disabled = false;
f[j].readonly = false;
}}})()
Werden Formularelemente mit dem Attribut disabled versehen, lassen sie sich in der Regel nicht mehr editieren oder anklicken. Ebenso können auf readonly gesetzte Eingabebereiche nicht vom Anwender beschrieben werden. Sind diese Felder jedoch mit unzutreffenden Angaben vorbelegt, kann es durchaus sinnvoll sein, diese Angaben zu ändern.
Das obige Skript zeigt Ihnen, wie einfach es geht: Mit dem forms-Objekt haben Sie Zugriff auf die im Dokument definierten Formulare. Weil sich die gesuchten Attribute nicht im Form-Tag selbst, sondern im Tag des jeweiligen Elements befinden, benötigen Sie zwei for-Schleifen: die erste, um alle Formulare zu erfassen, die zweite, um darin alle Elemente zu finden. Deaktiviert werden die Attribute dann dadurch, dass ihnen der Wert false zugewiesen wird.
Textfelder vergrößern
Bookmarklets
Ebenso einfach können Sie Textfelder erweitern, die zu klein geraten sind. Mit dem folgenden Bookmarklet lassen sich die auf der Seite vorhandenen Textfelder um jeweils fünf Reihen vergrößern. Zur weiteren Vergrößerung können Sie das Bookmarklet auch mehrmals anwenden:
javascript: (function() {
var i, x;
var en = document.getElementsByTagName('textarea');
for(i = 0; x = en[i]; i++)
x.rows += 5;
})()
Die Methode getElementsByTagName() erlaubt Ihnen den direkten Zugriff auf das Element mit dem entsprechenden Namen. Der Name, den Sie der Methode übergeben, ist übrigens ? wie auch HTML-Tags ? unabhängig von Groß- oder Kleinschreibung. Diese Methode findet die Tags auch dann, wenn sie im Dokument groß geschrieben sind.
Um alle Textfelder zu erfassen, verwenden Sie wieder eine for-Schleife. Mit der Zuweisung eines neuen Werts für rows bestimmen Sie dann die Anzahl der Reihen, um die sich die Felder beim Klick auf das Bookmarklet erweitern.
Ebay-Bewertungen anzeigen
Bookmarklets
Bevor Sie bei Ebay auf einen Artikel bieten, ist es oft sehr ratsam, einen Blick in das Bewertungsprofil des Verkäufers zu werfen. Wenn Sie sich dabei schon mal geärgert haben, dass viele Seiten durchgeblättert werden müssen, um weiter zurückliegende Bewertungen einsehen zu können, sollten Sie dieses Bookmarklet einsetzen. Es erspart Ihnen das mühsame Zurückblättern und listet Ihnen sämtliche negativen und neutralen Bewertungen des Ebay-Mitglieds mit nur einem Klick auf:
javascript: l = location.href;
urlarray = l.split('userid=');
userid = urlarray[1];
alert('username=' + userid);
location.href = 'http://www.toolhaus.org/cgi-bin/negs-de?User='+ userid + '&Dirn=Erhaltene';
Mit Hilfe der split()-Methode wird zunächst der Ebay-Name des jeweiligen Mitglieds ermittelt. Sie müssen dazu nur das Bewertungsprofil des Mitglieds aufrufen und dann dieses Bookmarklet aktivieren. Der gefundene Name wird dadurch an die angegebene Adresse angefügt und im Browser geladen. Dabei wird die sehr nützliche Web-Adresse von www.toolhaus.org verwendet. Das obige Skript fordert die deutschsprachige Version an. Dieser URL lässt sich natürlich auch direkt aufrufen, um die zur Verfügung gestellten Tools in Anspruch zu nehmen. Mit einem Bookmarklet geht es aber bei weitem schneller.
Sie können sich die Liste negativer Bewertungen sogar ohne Umweg über das Bewertungsprofil anzeigen lassen. Dafür brauchen Sie nur die alert()-Methode durch die prompt()-Methode zu ersetzen. Der gewünschte Mitgliedsname kann dann jederzeit in einem Dialogfenster eingegeben werden.
Fazit
Bookmarklets
Bookmarklets eignen sich hervorragend für die schnelle gezielte Manipulation der aktuellen Webseite. Weil der Webmaster keinen Einfluss darauf hat, geben sie dem Anwender ein mächtiges Instrument in die Hand. Wollen Sie als Anwender jedoch bestimmte Elemente von Webseiten permanent verändern oder generell ausblenden, sollten Sie einen lokalen Proxy-Server vorziehen.
Die vorgestellten Bookmarklets finden Sie zum Ausprobieren auf der Heft-CD und unter listings.internet-pro.de.