JQuery Kochbuch (German Edition)

haben wir eine Methode
ShowQuery
definiert, die aus einer jQuery-Selektion heraus aufgerufen werden kann. In dieser Methode geben wir die Selektion per Alert aus und rufen dann rekursiv
ShowQuery
mit dem gleichen jQuery-Selektor auf. Durch die
if
-Anweisung verhindern wir dabei eine rekursive Schleife.
    Die Core-Eigenschaften
.selector
und
.context
wurden in jQuery 1.3 eingeführt, das im Januar 2009 veröffentlicht wurde. Diese Methoden sind eher für Plugin-Entwickler gedacht, die eventuell etwas mit der ursprünglichen Selektion anstellen müssen. Dazu gehört zum Beispiel das erneute Ausführen der Selektion oder das Prüfen, ob sich ein Element in der Selektion befindet.
    .selector
liefert einen String mit dem aktuellen Selektor zurück, der genutzt wurde, um die angegebenen Elemente zu finden.
.selector
liefert den gesamten Selektor zurück, auch wenn die Selektion aufgeteilt wurde, indem ein erster Selektor zusammen mit der Methode
find()
verwendet wurde:
$("div").find("a").selector;

//gibt "div a" zurück
    .context
gibt den DOM-Knoten zurück, der ursprünglich an
jQuery()
übergeben wurde. Wenn kein spezieller Kontext angegeben wurde, ist dies das Dokument.

Chapter 4. jQuery-Tools
    Jonathan Sharp

Einführung
    Wenn man über jQuery spricht, geht es häufig um die Hauptkonzepte – das Bearbeiten des DOM und der Styles sowie die Events. Es gibt aber noch eine ganze Reihe weiterer »Core«-Features und Hilfsfunktionen, die dem Entwickler entgegenkommen. Dieses Kapitel konzentriert sich daher auf die nicht so bekannten Hilfsmethoden von jQuery.

Features mit jQuery.support erkennen
    Problem
    Sie müssen allen Anker-Tags,die nur ein Hash-Zeichen für die aktuelle Seite besitzen, einen speziellen
click
-Handler zuweisen, wollen aber Probleme, die aufgrund einer fehlenden Browser-Unterstützung auftreten können, vermeiden.
    Lösung
(function($) {
    $(document).ready(function() {
     $('a')
     .filter(function() {
     var href = $(this).attr('href');
     // Normalisieren der URL
     if ( !jQuery.support.hrefNormalized ) {
     var loc = window.location;
     href = href.replace( loc.protocol + '//' + loc.host + loc.pathname,
'');
     }
     // Dieses Anker-Tag hat die Form
     return ( href.substr(0, 1) == '#' );
     })
     .click(function() {
     // Eigentlicher click-Handler-Code
     });
    });
})(jQuery);
    Diskussion
    Das Objekt
jQuery.support
wurde in derVersion 1.3 von jQuery hinzugefügt und besitzt Boolesche Eigenschaften, mit denen man Code schreiben kann, der Browser-Features erkennt. In unserem Beispiel zeigt der Internet Explorer (IE)ein unterschiedliches Verhalten beim Umgang mit dem Attribut
href
. Der IE gibt die vollständige URL anstatt des exakten Attributs zurück. Mit dem Attribut
hrefNormalized
haben wir die Möglichkeit, uns auch dann richtig zu verhalten, wenn kommende Versionen des IE ein anderes Verhalten zeigen. Anderenfalls hätten wir bei unseren Lösungen jeweils die betreffenden Browser-Versionen berücksichtigen müssen. Das mag zwar zunächst verführerisch sein, trotzdem sollte man dieses Vorgehen vermeiden, da man folglich zukünfig seine Seite immer entsprechend anpassen müsste, wenn neue Browser-Versionen herauskommen. Ein anderer Grund, der gegen die direkte Browser-Prüfung spricht, ist der, dass Clients gezielt oder unabsichtlich einen falschen User Agent angeben. Neben dem Attribut
hrefNormalized
gibt es noch eine ganze Reihe weiterer Attribute:
    boxModel
True, wenn der Browser beim Rendern nach der Spezifikation für das W3C-CSS-Box-Modell vorgeht.
    cssFloat
True, wenn
style.cssFloat
genutzt wird, um den aktuellen CSS-Float-Wert zu erhalten.
    hrefNormalized
True, wenn der Browser das Ergebnis
getAttribute('href')
intakt lässt.
    htmlSerialize
True, wenn der Browser Link-Elemente mit dem Attribut
innerHTML
korrekt serialisiert.
    leadingWhitespace
True, wenn der Browser führende Leerzeichen beibehält, wenn man
innerHTML
nutzt.
    noCloneEvent
True, wenn der Browser beim Klonen von Elementen keine Eventhandler klont.
    objectAll
True, wenn
getElementsByTagName('*')
für ein Element alle abhängigen Elemente zurückgibt.
    opacity
True, wenn der Browser den CSS-Stil opacity interpretieren kann.
    scriptEval
True, wenn ein
appendChild
für ein