Kein .first()?

Simon Willison fragt zu Recht, warum es im aktuellen jQuery eigentlich keinen Ersatz für die Pseudo-Selektoren :first und :last gibt. Tatsächlich fehlen .first() und .last(), obwohl sie natürlich einfach selbst nachzutragen sind:

jQuery.fn.first = function() { return this.eq(0) };
jQuery.fn.last = function() { return this.eq(this.size() - 1) };

jQuery 1.2.2

Während man auf der jQuery Homepage noch hinterherhinkt, kann man hier schon die neue Version 1.2.2 bekommen.

Vielleicht wichtigste Verbesserung (neben wieder mal angeblich dramatischen Geschwindigkeitserhöhungen, gähn): .ready() wurde komplett üpberarbeitet:

The document ready function has been long due for some extra love. We’ve made a number of specific changes.

  • Internet Explorer document ready drastically improved. We use a new technique inspired by Diego Perini. It allows us to not have to do a document.write() anymore, which is really fantastic.
  • All browsers now wait for CSS to be ready, in addition to just the DOM. In reality, it’s not just a vanilla document ready anymore – but we found that users, overwhelmingly, needed to wait for document styling to be active (such as knowing if an element is visible, or what its height is). Specifically we’ve added improvements to Safari and Opera to make this possible.
  • $(document).bind(„ready“, fn); – You can now watch for the document ready event via the traditional .bind() function. Of course, .ready() still works as you would expect it to.

jQuery 1.2

Unter jQuery 1.2: jQuery.extend(”Awesome”) kündigt das jQuery-Blog die Auslieferung von jQuery 1.2 an. Es hat sich viel getan, wie sich ja schon im letzten Release ankündigte. Soviel, dass man neben dem Upgrade-Guide auch gleich drei 1.1-Compability-Plugins mitliefert: ein jQuery 1.1 Compatibility Plugin, das XPath Compatibility Plugin und das Color Animation Plugin.

Die Liste der Neuerungen ist ausgesprochen lang, darum hier meine Highlights:

  • Selektoren: XPath Selector Plugin
  • DOM Traversal: .prevAll() / .nextAll()
  • DOM Manipulation: wrapInner() / .wrapAll() und .replaceWith() / .replaceAll()
  • CSS: .offset()
  • Ajax: Cross-Domain getScript

Ein Major-Update will natürlich gut vorbereitet sein, von daher werde ich die nächsten freien Zeiten in ausgiebiges Testen vertieft sein. Ggf. berichte ich dann davon.

jQuery 1.1.4

Update: jQuery 1.1.4: Faster, More Tests, Ready for 1.2.

Hui, hatte ich so schnell gar nicht mit gerechnet. Gerade noch letzte Woche habe ich die 1.1.3 gepachted (aus reiner Ungeduld), da gibt’s schon wieder eine neue Version. Der Bug mit dem wir wirklich zu hadern hatten („Latest Nightlies Crash Safari 1.3.2„) ist gelöst, wie noch 53 andere. Mit dem festen Blick auf jQuery 1.2 gibt’s auch schon ein paar neue Funktionen, andere sind dafür ab sofort deprecated. Neu ist zum Beispiel die Methode .slice(), der Selektor :has, extend() wurde erweitert. Ebenso wie .noConflict(), mit dem man jetzt sowohl jQuery und dessen Abkürzung $ umbenennen kann.

Und hatte ich vor kurzem noch die XPath-Möglichkeiten gelobt, sind sie heute schon für überholt erklärt. Empfohlen wird die Nutzung der entsprechenden CSS-Ausdrücke, und es wird darauf hingewiesen, dass es ab 1.2 ein spezielles XPath-Plugin geben wird. Da freue ich mich jetzt mal ganz optimistisch drauf.

window.onload, schon wieder

Kann ich nicht mehr hören! Seit Wochen hadere ich ernsthaft mit den typischen Problemen, die auftreten, wenn man Events nicht mit (bösen, bösen, bösen 1) inline-Eventattributen („onclick“, etc.) zuordnen will (oder eben kann). Der Ladenvorgang eines HTML-Dokuments, vor allem eines sehr großen (hüstel), ist eine wacklige Angelegenheit, soviel kann man schon mal fesstellen. Da kann viel passieren: das DOM ist fertig, da wird vom Adserver noch etwas nachgeladen, huch, hier mal ein Flashlayer, der alles zerballert, der User klickt wild in der Navi herum, die immer noch nicht initialisiert ist, da funzelt noch ein AdBlocker dazwischen…

Konkret: es gibt natürlich verschiedene Lösungsansätze für das Problem, jQuery bedient sich der Methode von Dean Edwards für ihr eigentlich wunderbares jQuery.ready(). Nur, es funktioniert nicht immer. Und: was geht, und was nicht, hängt zu gut 60% von äußeren Umständen ab, also vom Browser, zusätzlich geladenen Skripten auf die man keinen Einfluss hat (Werbung) und wie schon gesagt, auch gerne mal einem Browserplugin. Und manchmal kommt auch ein ambitionierter Kollege und überschreibt alles mit einem fröhlichem onload. 😉

Ich stehe gerade kurz davor das Ganze wieder ganz altmodisch ins <body onload=""> zu verlegen, nur damit endlich Ruhe ist. Nein, da ist mir gerade nochmal Peter Michaux dazwischen gekommen. Er hat die einzelnen Methoden und Lösungen zumindest ordentlich analysiert und kommt zu ähnlichen Ergebnissen wie ich. Und hat eine Lösung.

My suggested solution trades a minor impurity in programmer ideals for an always functional UI. It’s an “if you can’t beat them, join them” solution. It’s a compromise but like Dan Cederholm’s compromise it is fixed string of attributes that is tacked on without any thought. It may be a challenge to build an efficient implementation of this solution but there is no hacking based on brittle browser features and no exposure. This solution depends only on documented browser features and behavior. That’s a compromise I can abide.

Peter hat eine Methode erdacht, die sozusagen das beste aus beiden Welten zu vereinigen weiss, nämlich jQuery.ready() und das hervorragende LiveQuery Plugin über das ich schon gestern kurz berichtet hatte. Ich werd’s testen.

1: Die Nutzung von inline-Eventattributen steht gegen die Trennung von Inhalt und Präsentation, der ich normalerweise anhängig bin. Ich bin zwar pragmatisch genug mich von soetwas zu kicken, wenn es drauf ankommt, aber da wir mit XML-Dokumenten arbeiten, die per XSLT in HTML gestyled werden, dass mit CSS gestyled wird… da geht das schon irgendwie zum Prozess. 😉 Zudem machen unterschiedliche Leute die XSLTs und die Javascripte etc. Da sind solche Trennungen auch für den Arbeitsprozess mehr als praktisch. Wenn’s funzt zumindest.

Live Query

Live Query, previously called Behavior, utilizes the power of jQuery selectors by binding events or firing callbacks for matched elements auto-magically, even after the page has been loaded and the DOM updated.

Live Query via Ajaxian.