jQuery Kurz und bündig JQuery-Manipulation

HTML schnell erstellen, bedienen und hinzufügen

Sie können HTML-Markup im Handumdrehen erstellen, indem Sie der jQuery-Funktion eine Zeichenfolge aus rohem HTML übergeben.

       

Beachten Sie, dass beim Erstellen von DOM-Strukturen mit der jQuery-Funktion nur Stammelemente in der Struktur zum Wrapper-Set hinzugefügt werden. Im vorherigen Codebeispiel ist das

Elemente sind die einzigen Elemente im Wrapper-Set.

Wir können die verwenden finden() Methode, um ein beliebiges Element in der HTML-Struktur zu bearbeiten, sobald es erstellt wurde.

       

Nachdem Sie den neu erstellten HTML-Code bearbeitet haben, können Sie ihn auch mit einer der Manipulationsmethoden von jQuery in das DOM einfügen. Im Folgenden verwenden wir die Anhängen() Methode, um das Markup zur Seite hinzuzufügen.

       

Anmerkungen: Einfache Elemente, die keine Attribute enthalten - z. $ ('

') - werden über die erstellt document.createElement DOM-Methode, während alle anderen Fälle auf die innerHTML Eigentum. Tatsächlich können Sie die jQuery-Funktion, mit der ein Element erstellt wurde, direkt übergeben document.createElement -z.B. $ (document.createElement ('div')).

Die an jQuery übergebene HTML-Zeichenfolge darf keine Elemente enthalten, die innerhalb von a als ungültig betrachtet werden können

Element.

Die an die jQuery-Funktion übergebene HTML-Zeichenfolge muss ordnungsgemäß formatiert sein.

Sie sollten alle HTML-Elemente öffnen und schließen, wenn Sie jQuery-HTML übergeben. Andernfalls kann es zu Fehlern kommen, hauptsächlich in Internet Explorer. Schließen Sie einfach Ihre HTML-Elemente und vermeiden Sie das Schreiben von HTML-Verknüpfungen - z. $ (

).


Indexierung der Methode ()

Sie können den Index eines Elements im Wrapper-Set ermitteln, indem Sie dieses Element an das übergeben Index() Methode. Angenommen, Sie haben ein Wrapper-Set, das alle Dateien enthält

Elemente auf einer Webseite, und Sie möchten den Index der letzten kennen
Element.

    
0
1
2
3

Die Verwendung von Index() trifft nicht wirklich zu Hause, bis wir überlegen, wie es mit Ereignissen verwendet werden kann. Als Beispiel, indem Sie auf klicken

Elemente im untenstehenden Code können wir den angeklickten übergeben
Element (mit dem Schlüsselwort diese) zum Index() Methode, um das angeklickte zu bestimmen
Index.

    
Nav-Text
Nav-Text
Nav-Text
Nav-Text

Text () Methode grokken

Man könnte fälschlicherweise davon ausgehen, dass die Text() Die Methode gibt nur den Textknoten des ersten Elements in einem Wrapper-Set zurück. Es verknüpft jedoch tatsächlich die Textknoten aller Elemente, die in einem Wrapper-Set enthalten sind, und gibt den verketteten Wert als eine einzige Zeichenfolge zurück. Stellen Sie sicher, dass Sie über diese Funktionalität Bescheid wissen, oder Sie erhalten möglicherweise unerwartete Ergebnisse.

    
1,
2,
3,
4

Aktualisieren Sie oder entfernen Sie Zeichen mithilfe eines regulären Ausdrucks

Mit dem JavaScript ersetzen() In Kombination mit einigen jQuery-Funktionen können Sie jedes Zeichenmuster aus dem in einem Element enthaltenen Text sehr einfach aktualisieren oder entfernen.

    

Ich hasse es wirklich, JavaScript zu verwenden. Ich meine, ich hasse es wirklich! Es ist der beste Twister aller Zeiten!

Sie können auch alle Zeichen aktualisieren, die in einer Zeichenfolge enthalten sind, von der zurückgegeben wird html (). Dies bedeutet, dass Sie nicht nur Text aktualisieren können, sondern auch DOM-Elemente über einen regulären Ausdruck aktualisieren und ersetzen können.


Grokking der .contents () - Methode

Das .Inhalt() Diese Methode kann verwendet werden, um alle untergeordneten Elementknoten zu finden, einschließlich der in einem Element enthaltenen Textknoten. Es gibt jedoch einen Haken. Wenn der abgerufene Inhalt nur Textknoten enthält, wird die Auswahl als einzelner Textknoten im Wrapper-Set platziert. Wenn jedoch der Inhalt, den Sie abrufen, einen oder mehrere Elementknoten zwischen den Textknoten enthält, wird der .Inhalt() Die Methode enthält Textknoten und Elementknoten. Untersuchen Sie den folgenden Code, um dieses Konzept zu verstehen.

    

Ich liebe es, jQuery zu verwenden!

ich liebe Ja wirklich mit jQuery!

Beachten Sie, dass wenn ein Element im Wrapper-Set ein Textknoten ist, der Wert mithilfe von extrahiert werden muss .get (0) .nodeValue. Das Inhalt() Diese Methode eignet sich zum Extrahieren von Textknotenwerten. Es ist möglich, nur die Textknoten aus einer DOM-Struktur mit zu extrahieren Inhalt().

    

jQuery gibt mir Mehr Leistung als jedes andere Web-Tool!


Mit remove () werden keine Elemente aus dem Wrapper-Set entfernt

Wenn Sie verwenden Löschen(), Ein DOM-Snippet aus dem DOM Die Elemente, die in der entfernten DOM-Struktur enthalten sind, sind immer noch im Wrapper-Set enthalten. Sie können ein Element entfernen, dieses Element bearbeiten und dieses Element dann tatsächlich wieder in das DOM einfügen, alles innerhalb einer einzigen jQuery-Kette.

    
entferne mich

Der Punkt hier ist das nur weil Sie Löschen() Elemente bedeuten nicht, dass sie aus dem Wrapper-Set von jQuery entfernt werden.