Unobtrusively Mapping Microformats with jQuery

Auf 24 ways habe ich einen schönen Artikel über Unobtrusively Mapping Microformats with jQuery gefunden.

Unobtrusive JavaScript verfolgt den Ansatz, den JavaScript Code komplett von der HTML Seite zu trennen. Dise Methode ermöglicht das schnelle und einfache Ändern des JavaScript-Codes an zentraler Stelle, ähnlich wie bei der Trennung von Design und HTML bei CSS.

Der Artikel beschreibt, wie man mit hCard ausgezeichnete Kontakt-Daten auf Google-Maps anzeigt.

Eine wesentlich simplete Demo lässt sich mit den rel-Attribute realisieren. Als Beispiel HTML Code nehmen wir das rel-nofollow Microformat:

<a href="http://google.de" rel="nofollow">Google.de</a>Code-Sprache: HTML, XML (xml)

Mit dem folgenden Code ist es Möglich, das a HTML-Tag mit dem CSS-Code text-decoration: line-through; zu erweitern.

jQuery("a[@rel=nofollow]").css("text-decoration", "line-through");Code-Sprache: JavaScript (javascript)

Das ganze funktioniert natürlich auch wesentlich eleganter mit CSS, aber es geht hier ja nur ums Prinzip 😉

Den wesentlich besseren und ausführlicheren Bericht gibt es auf 24ways.org.