Tips zum Umgang mit jQuery

Fertige Komponenten in die eigenen Sites bauen ist das eine. Das andere ist natürlich die Funktionailität selbst zu bauen. Dafür sind detailierte Kenntnisse über das Coding mittels jQuery notwendig. Hier mal ein paar Beispiele zum warm werden..
each statt for oder while

For-Schleifen mit Inkrementor, While-Schleifen mit Abbruch Bediengung. Kein großes Problem, aber oft umständlich. Viel einfacher geht es mit der each oder for-each Schleife. Vor allem in Verbindung mit Arrays. Auch in Java 5 steht das each wieder zur Verfügung. Hier mal ein kleines Beispiel:

^?View Code JAVASCRIPT

var myArray = ['MooTools','Prototype','jQuery'];
 
$.each(myArray, function(index, item) {
// Mache etwas mit dem Arrayelement
// return false für Abbruch, true für weitermachen
// each wird automatisch verlassen wenn jedes Element
// durchlaufen ist
});

Filter Funktion

Damit lassen sich Elemente aus dem DOM-Baum einfach entfernen. Im Code kann das wie folgt aussehen:

^?View Code JAVASCRIPT

$('div').filter(function(){
    return this.childNodes.length &gt; 5;
    // Gibt einen Boolschen Wert zurück
});

Eventhandling mal anders

Um ein Event an ein Element zu binden ist nicht zwingend die ID des Elements notwendig. Dieser Vorgang lässt sich auch einfach mittels Variable umsetzen.

^?View Code JAVASCRIPT

var myDiv = $('<div>').appendTo('body');
 
// Verwende myDiv um Click Funktion herzustellen
myDiv.bind('click', function(){
    // do something......
});</div>

Logger für Performance Messung

Es gibt für ein Problem immer viele Lösungen. Um rauszufinden welche sich besser eignet stehen mit jQuery Konsolen Befehle zur Verfügung.

^?View Code JAVASCRIPT

console.time('Test1');
   // Programmlogik der ersten Variante..
console.timeEnd('Test1');
 
console.time('Test2');
   // Logik der Zweiten...
console.timeEnd('Test2');
 
// Das Firefox Plugin "Firebug" wird das Ergebnis mitloggen