Eine Best Practices-Frage zu jQuery.
Ich schreibe eine sehr jQuery-intensive Webseite. Ich bin neu in jQuery und bemerke seine Macht, aber da ich mit schwerem Javascript Erfahrung und Wissen komme, ist meine Frage: Was in jQuery und was in einfachem Javascript getan werden sollte.
Zum Beispiel gibt es Callbacks, die ein einfaches DOM-Objekt als Argument senden. Sollte ich das verwenden oder sollte ich es umbrechen (wie $(this) ).
Ist es wichtig, ob ich das tue.x = y oder $ (this) .attr ("x", y).
Wenn Ihre Funktion ein DOM-Objekt empfängt und Sie keine jQuery-Funktionalität für dieses DOM-Objekt benötigen, müssen Sie sie nicht in ein jQuery-Objekt konvertieren. Wenn Sie beispielsweise ein Checkbox-Objekt erhalten, können Sie die Eigenschaft checked ohne Verwendung von jQuery untersuchen.
Wenn Sie jedoch zu einem anderen Element als diesem Kontrollkästchen navigieren müssen, kann es sich lohnen, es zu konvertieren:
%Vor%jQuery (wie andere Bibliotheken) fügt sich nahtlos in native JS ein. Wenn Sie zusätzliche Funktionalität benötigen, erweitern Sie das betreffende Objekt.
Wie bei Ihrer letzten Frage: Möglicherweise ist die Funktion data hilfreich, um nicht standardmäßige DOM-Attribute zu vermeiden. Wenn Ihre Eigenschaft x in Ihrer Frage tatsächlich ein gültiges DOM-Attribut ist, können Sie entweder this.x = y oder $(this).attr('x', y) schreiben, IMO spielt es keine Rolle. Wenn x jedoch kein DOM-Attribut ist, verwenden Sie
Auf diese Weise können Sie beliebige Schlüssel / Wert-Paare mit dem DOM-Element speichern, wobei value ein beliebiger primitiver Wert oder ein beliebiges primitives Objekt sein kann.
Ich denke, es ist ein Urteilsspruch. Nutze deinen gesunden Menschenverstand.
Wenn Sie beispielsweise 1000 divs auf der Seite haben, möchten Sie diese wahrscheinlich nicht in $ (..)
einschließen %Vor%Wie bei anderen Aufgaben können Sie, solange Sie verstehen, was jQuery macht, nur aus Gründen der Konsistenz daran festhalten, aber beachten Sie die Leistungsprobleme wie im obigen Beispiel.
Wie @colinmarc erwähnt, verwischt jQuery manchmal die Unterscheidung zwischen Elementattributen und Objekteigenschaften, die irreführend und fehlerhaft sein können.
Wenn Sie jQuery verwenden, gibt es immer eine Instanz von jQuery zurück, es sei denn, Sie verwenden eine Funktion wie val ();
Der Grund, warum wir $ (this) .value anstelle von this.value verwenden, ist sicherzustellen, dass dies eine Instanz von jQuery ist.
Wenn irgendwo in Ihrem Code eine Variable mit dem Namen my_link gesetzt wird, die ein DOM-Objekt und nicht eine jQuery-Funktion ist .. weiter in Ihrer Anwendung würde my_link.val () zu einem Fehler führen, aber indem Sie $ (my_link) ausführen. val () wird Ihnen versichern, dass die Funktion val verfügbar sein wird. as $ () gibt eine Instanz von jquery zurück.
Entschuldigung für das Missverständnis in meinem vorherigen Beitrag.
Da jQuery-Objekte eine umfangreichere Funktionalität als JS-DOM-Knoten haben, können Sie, wenn Sie sich am Zaun befinden, genauso gut in jQuery einbinden. JQuery ist so leicht, es gibt nicht viel Grund, keine jQuery-Objekte zu verwenden.
Ist es wichtig, ob ich das tue.x = y oder $ (this) .attr ("x", y).
Der Native wird etwas schneller sein, aber Sie werden wahrscheinlich mehr Zeit in anderem Code verbringen - DOM Traversal oder Building. In diesem speziellen Beispiel ist Ersteres prägnanter, also würde ich das wählen. Da jQuery so leicht ist, tendiere ich dazu, flüssig hin und her zu schalten.
Hier sind weitere Richtlinien, denen wir folgen:
var $this = $(this); . Obwohl es wirklich keine große Sache ist, $ (exzessiv) zu nennen, sieht es doch schlampig aus, wenn man es zu viel nennt. Hoffe, das hilft.
Tags und Links javascript html jquery