Ajaxschmiede.de

Vor kurzem wurde die Beta-Version des Javascript-Frameworks MooTools 1.2 veröffentlicht.

MooTools, das mit zu den umfangreichsten Javascript-Programmiergerüsten gehört, bietet – ähnlich wie jQuery – Möglichkeiten zum vereinfachten Ansprechen von Elementen samt Unterstützung einer Vielzahl an CSS-Selektoren und zur Erzeugung von Effekten.

Kernstück der MooTools ist sicherlich die sehr gut implementierte Unterstützung des objektorientierten Ansatzes von Javascript, die den Umgang mit Klassen für JS-Entwickler erheblich erleichtert. Eine Einführung in die Grundlagen der MooTools-API findet sich auf der Projekthomepage.

Folgende Neuerungen fanden in Version 1.2 Einzug:

• breitere Unterstützung erweiterter Selektoren, z.B. CSS 3-Pseudo-Selektoren wie var myElements = $$(‚div:disabled‘); oder verschachtelter Selektoren wie $$(‚div.class1.class2[id=“someid“][name=“somename“]‘);
• vollständige iFrame-Unterstützung
• vereinfachte Anwendung von „generics“ zum Hinzufügen vom prototype-Funktionen an ein Objekt
• konsistenter Class-Konstruktor, der es ermöglicht, die Klasse zu erfragen, von der ein Objekt erzeugt wurde
• eine Vielzahl weiterer kleiner Verbesserungen

Gesondert möchte ich eine weitere Neuerung eingehen, die das Speichern und Verwalten von Elementen betreffen.

Wie MooTools-Entwickler Tom in seinem Blog in englischer Sprache genauer erklärt, wurde es durch Probleme mit dem Internet Explorer notwendig, sich dem Verwalten von Objekten als Elementattribute zu beschäftigen.
Das Ergebnis ist ein Workaround, das jegliche Probleme beseitigt und den Entwicklern dadurch ermöglicht, an Elemente Objekte als Attribut anzuhängen – ohne sich um die Besonderheiten des IE zu kümmern.

Wie das nun konkret ausschaut, soll der nachfolgende, von mir kommentierte Beispielcode zeigen:

var element = $('myElement');
// greift auf Element "myElement" zu
var data = element.retrieve('galleryData', {});
// hängt an ein leeres Objekt mit dem Namen 'galleryData' an 'myElement' an
data.id = 16;/
/ hängt Attribut 'id' an 'galleryDate' an
data.source = '/images/16.jpg';
// setzt Attribut 'source' für 'galleryDate'
data.title = 'Some Title';
// Element 'galleryDate' bekommt 'title'-Attribut

Der Zugriff funktioniert genauso:

$('myElement').retrieve('galleryData');
// Rückgabewert: { id: 16, source: '/images/16.jpg', title: 'Some Title' }
$('myElement').retrieve('galleryData').id;
// Rückgabewert: 16

MooTools 1.2 beta 2 herunterladen