Bücher online kostenlos Kostenlos Online Lesen
jQuery von Kopf bis Fuß (German Edition)

jQuery von Kopf bis Fuß (German Edition)

Titel: jQuery von Kopf bis Fuß (German Edition) Kostenlos Bücher Online Lesen
Autoren: Ryan Benedetti , Ronan Cranley
Vom Netzwerk:
Wir meinen die Methoden
before
und
after
.
    before
fügt Inhalte vor dem gewählten Element ein und
after
danach.
$(".fleisch") .before ("
  • Tofu
  • ");

        after
    fügt Inhalte nach dem ausgewählten Element ein.
    $(".fleisch") .after ("
  • Tofu
  • ");

        Spitzen Sie Ihren Bleistift
        Schreiben Sie den jQuery-Code, der die Schritte unserer Lösung ausführt.
        Fügen Sie die li-Elemente mit der Klasse »tofu« nach den »fleisch«-Elementen ein.
        __________________________________________________________________________
    Entfernen Sie die Elemente mit der Klasse »fleisch« und speichern Sie sie in einer Variablen.
        __________________________________________________________________________
        Spitzen Sie Ihren Bleistift: Lösung
        Schreiben Sie den jQuery-Code, der die Schritte unserer Lösung ausführt.
        Fügen Sie die li-Elemente mit der Klasse »tofu« nach den »fleisch«-Elementen ein.
        $(“.fleisch”).after(“
  • Tofu
  • ”);
    Entfernen Sie die Elemente mit der Klasse »fleisch« und speichern Sie sie in einer Variablen.
        $m = $(“.fleisch”).detach();
        Damit haben Sie alle Anforderungen auf unserer Checkliste erfüllt:
        Finde Elemente mit der Klasse »fisch« und entferne sie aus der Liste.
    Finde li-Elemente mit der Klasse »hamburger« und ersetze sie durch Portobello-Champignons.
    Finde li-Elemente mit der Klasse »fleisch« und ersetze sie durch Tofu.
        Als Nächstes müssen wir den »Menü zurücksetzen«-Button erstellen. Hier kommt das, was der Button tun soll:
        Fügen Sie die Fisch-Vorspeisen wieder an ihrer ursprünglichen Position im DOM ein (also vor dem ersten Listeneintrag in der linken Spalte).
    Finden Sie Vorspeisen mit Portobello-Champignons und ersetzen Sie sie durch Hamburger.
    Finden Sie die Vorspeisen, die Tofu enthalten, und ersetzen Sie sie (in der richtigen Reihenfolge) durch die verschiedenen Fleischsorten.
        Lassen Sie uns gleich loslegen und sehen, was wir für die erste Anforderung brauchen.

        Wir wissen, wir man
    before
    benutzt, aber wie geben wir das erste Kindelement an?

    Die Auswahl mit Filtermethoden einschränken (Teil 1)
        Glücklicherweise bietet jQuery eine Reihe von Filtermethoden, mit denen sich Probleme wie das Finden des ersten Kindelements lösen lassen. Sechs davon wollen wir uns hier ansehen (drei auf dieser Seite, drei auf der nächsten).
        first
    eq
    last
    Die
    first
    -Methode filtert aus den ausgewählten Elementen alles außer dem ersten Element heraus.
    Die
    eq
    -Methode filtert aus den gewählten Elementen alles heraus, was nicht die index-Nummer in den runden Klammern hat.
    Die
    last
    -Methode filtert aus den gewählten Elementen alles außer dem letzten Element heraus.
        Anhand eines Gerichts auf der Speisekarte wollen wir uns ansehen, wie diese Methoden funktionieren:

    Die Auswahl mit Filtermethoden einschränken (Teil 2)
        Und jetzt wollen wir einen Blick auf die Methoden
    slice
    ,
    filter
    und
    not
    und ihre Funktionsweisen werfen.
        slice
    filter
    not
    Die
    slice
    -Methode filtert aus der Ergebnisliste alle Elemente aus, deren Indexnummern nicht zwischen den Indexnummern liegen, die in den runden Klammern stehen.
    Die
    filter
    -Methode filtert alle Elemente aus der Ergebnisliste, bis auf diejenigen, auf die der Selektor in den runden Klammern passt.
    Die
    not
    -Method filtert alle Elemente aus der Ergebnisliste, auf die der Selektor in den runden Klammern nicht passt.

        Mit den Methoden
    filter
    und
    not
    können Sie anhand der als Argumente übergebenen Selektoren eine Untermenge der ausgewählten Elemente erstellen.

        Welche dieser Methoden hilft Ihnen damit, das erste Kindelement in der Speisekarte zu finden?
        SEIEN Sie das DOM
        Ihre Aufgabe ist es, selbst DOM zu spielen. Zeichnen Sie eine Linie von der jQuery-Anweisung zu den Elementen im DOM, die der Selektor zurückgibt. Gehen Sie davon aus, dass das die einzigen Elemente der Seite sind. Die erste Verbindung haben wir schon für Sie gezeichnet.
        Spitzen Sie Ihren Bleistift
        Schreiben Sie die Zeile jQuery-Code auf, die alle Fisch-Vorspeisen wieder an ihre ursprüngliche Stelle in der Speisekarte einfügt (z. B. das erste Gericht unterhalb von »vorspeisen«).
    _____________________________________.before($f);
        Seien Sie das DOM: Lösung
        Ihre Aufgabe ist es, selbst DOM zu spielen. Zeichnen Sie eine Linie von der jQuery-Anweisung zu den Elementen im DOM, die der Selektor zurückgibt. Gehen Sie davon aus, dass das die einzigen Elemente der Seite sind. Die erste Verbindung haben wir schon für Sie gezeichnet.
        Spitzen Sie

    Weitere Kostenlose Bücher