Die Webentwicklungs-Community wurde am 14. Januar 2009, als jQuery Version 1.3.0 offiziell veröffentlicht wurde, sehr begeistert. jQuery 1.3 bringt erhebliche Verbesserungen mit sich, besonders wenn es um Geschwindigkeit geht. Darüber hinaus konnten die Entwickler jQuery so klein wie möglich halten und dabei einige großartige und häufig angeforderte Funktionen hinzufügen. Heute werden wir uns eingehend mit den neuen Funktionen beschäftigen und erfahren, wie Sie das Beste daraus machen können.
Wenn Sie jQuery noch nicht kennen und die neueste Version herunterladen müssen, besuchen Sie die jQuery-Startseite und klicken Sie auf den Download-Link, um zu beginnen. Wenn Sie ein Upgrade von einer früheren Version durchführen, werden Sie erfreut sein, dass das API konsistent und mit älteren Versionen kompatibel ist. Um ein Upgrade durchzuführen, aktualisieren Sie einfach die jQuery-Version auf Ihrem Server und verknüpfen Sie sie ordnungsgemäß. Y In diesem Artikel werden wir alle Änderungen besprechen, die Probleme mit Ihrem aktuellen Code verursachen können.
Die Entwickler von jQuery haben mit ihrer css-Selector-Engine einen großen Schritt nach vorne gemacht und ein eigenständiges Projekt namens "Sizzle" gestartet. Sizzle ist jetzt das CSS-Auswahlmodul für jQuery und wird von der Dojo Foundation betrieben. Sizzle sieht bereits vielversprechend aus für mehr Frameworks als nur jQuery, da es offen ist und für alle Entwickler verfügbar ist, die es in ihren Projekten verwenden möchten. Weitere Informationen zu Sizzle finden Sie auf der jQuery-Release-Seite und auf der Homepage von Sizzle. jQuery arbeitet derzeit mit Prototype, Dojo, Yahoo UI, MochiKit, TinyMCE und vielen weiteren Bibliotheken zusammen, um diese Engine noch leistungsfähiger zu machen.
Mit der Veröffentlichung eines neuen Motors kommt eine wesentlich schnellere Leistung zustande. in manchen Fällen über 400% schneller, abhängig vom verwendeten Browser. jQuery veröffentlichte ihre Testergebnisse mit Selektoren, die die Leute tatsächlich verwenden (die wir im nächsten Abschnitt dargestellt haben). In der Grafik unten finden Sie die neuen Ergebnisse der Auswahl.
Wie bereits erwähnt, basierten die Selektor-Leistungstests auf den von den Benutzern tatsächlich verwendeten Selektoren. Ich fand diese Daten an sich interessant und Sie finden sie hier. Es ist jedoch nur in einem Textformat und ich mag Diagramme und Diagramme. Eine der Dingen, die mir auffielen, war, wie ein so kleiner Prozentsatz von Menschen die Sichtbarkeitsauswahl nutzte. Nachfolgend finden Sie die Selektoren, die Entwickler heutzutage am häufigsten in jQuery-Skripts verwenden.
Eine weitere wirklich aufregende Sache bei der Veröffentlichung von jQuery 1.3 ist die Veröffentlichung eines neuen jQuery-API-Browsers, der von Remy Sharp erstellt wurde. Sie können über das Internet darauf zugreifen, um eine beliebige jQuery-Methode oder -Funktion zu suchen. Noch besser ist es, als Offline-Browser mit dem Adobe Air Flash-Installationsprogramm herunterzuladen. Grundsätzlich macht die jQuery-API alle Informationen oder Dokumentationen mit oder ohne Internetverbindung mit wenigen Klicks zugänglich.
Über:Offline-Browser läuft.
Bis jetzt hat jQuery einen Prozess ausgeführt, der als Browser-Sniffing bezeichnet wird, um die Aktion zu bestimmen, die der Code ausführen soll. Der Nachteil dabei ist, dass davon ausgegangen wird, dass immer ein Fehler oder ein Feature vorhanden ist. jQuery überwindet dies, indem ein einzelnes Objekt verwendet wird, das als jQuery.support bezeichnet wird, und es wird kein Sängerbenutzer-Agent mehr ausgewählt. John erklärt, wie jQuery.support selbst am besten funktioniert:
Wir verwenden eine Technik namens Feature Detection, bei der wir eine bestimmte Browserfunktion oder einen Fehler simulieren, um ihre Existenz zu überprüfen. Wir haben alle Prüfungen, die wir in jQuery verwenden, in einem einzigen Objekt zusammengefasst: jQuery.support. Weitere Informationen dazu, zur Funktionserkennung und zu den Funktionen dieser Funktion finden Sie in der Dokumentation zu jQuery.support.
Was bedeutet das am Ende? Dies bedeutet, dass jQuery- und jQuery-Plugins mit der Zeit viel zuverlässiger werden, da wir nicht mehr auf das Browser-Sniffing angewiesen sind, um einen bestimmten Browser / Benutzeragenten zu bestimmen. John merkt auch an, dass jQuery.browser immer noch in jQuery bleibt und noch eine Weile bestehen bleibt. Es ist veraltet und es wird empfohlen, stattdessen die Funktionserkennung zu verwenden.
Eine aufregende und sicherlich nützliche Funktion, die mit 1.3 veröffentlicht wurde, ist die neue Funktion "Live Events". Live-Ereignisdelegierung bedeutet, wenn einem Element ein Ereignishandler zugeordnet ist, wird bei allen weiteren erstellten Elementen auch dieser Ereignishandler angehängt. Nimm den Code, der in der Live-Dokumentation enthalten ist.
$ ("p"). live ("click", function () $ (this) .after ("Noch ein Absatz!
"););
Auf den ersten Blick fragen Sie sich vielleicht: Warum sollte ich nicht einfach einen Click-Event-Handler an das p-Tag anhängen? Bei genauerer Betrachtung stellen wir fest, dass alle nach dem aktuellen Absatz eingefügten p-Elemente auch den Event-Handler enthalten, wodurch der Effekt uneingeschränkt genutzt werden kann. Weitere Informationen zu den Live-Events finden Sie in den jQuery-Dokumenten.
Ein weiteres großartiges Feature von 1.3 wurde angehäuft, und die Entwickler gaben uns am nächsten (), was genau das tut, was Sie denken. Die Funktion close () kann verwendet werden, um das nächstgelegene Element innerhalb eines bestimmten Parametersatzes zu finden. Sehen wir uns noch einmal die Demo an.
$ (document) .bind ("click", Funktion (e) $ (e.target) .closest ("li"). toggleClass ("highlight"););
Im obigen Code binden wir eine Klickfunktion an das aktuelle Dokument und fügen / entfernen die Klasse 'Highlight' zum nächstgelegenen li-Element, wenn ein Benutzer klickt. Wenn kein Element gefunden wird, wird das Dokument weiter nach oben verschoben, bis es eine Übereinstimmung findet. Wenn keine Übereinstimmung gefunden wird, wird nichts ausgeführt. Erfahren Sie mehr über das Befahren mit dem nächstgelegenen ().
Bei der DOM-Manipulation und beim Einfügen / Erstellen neuer HTML-Elemente konnte jQuery eine deutliche Geschwindigkeitsverbesserung feststellen. Dies würde für die Verwendung von Methoden wie .insertBefore () und append () usw. gelten. Um eine bessere Vorstellung von den Geschwindigkeitsänderungen zu erhalten, werden wir uns einen anderen, erstaunlichen Graphen anschauen.
Es ist sinnvoll, dass sich die Entwickler Zeit genommen haben, um die Geschwindigkeit der Hide / Show-Effekte zu erhöhen. Dies sind zwei der am häufigsten verwendeten jQuery-Effekte. Geschwindigkeitsergebnisse siehe unten.
Wenn Sie in Ihren jQuery-Skripts häufig offset () verwenden, werden Sie erfreut sein, dass sich auch die Offsetgeschwindigkeit erheblich verbessert hat. Falls Sie sich gefragt haben, erhält offset () einfach den aktuellen Versatz des übereinstimmenden Elements relativ zum Dokument. Ergebnisse siehe unten.
Ihr erster Halt, um alles und alles, was in dieser Version enthalten ist, herauszufinden. Und wenn Sie noch mehr Grafiken und Diagramme wünschen, können Sie sie auch dort finden.
Besuche die Website
Vergessen Sie nicht, den neuen jQuery API / Offline-Browser auszuprobieren. Er erspart Ihnen viel Zeit und Fragen, wenn Sie nicht weiterkommen.
Besuche die Website
Jeffrey hat im ThemeForest Blog eine hervorragende 15-teilige Serie mit einer Vielzahl von jQuery-Tipps, -Tricks und -Techniken erstellt. Verpassen Sie es nicht!
Besuche die Website