JQuery Kochbuch (German Edition)

Titel: JQuery Kochbuch (German Edition) Kostenlos Bücher Online Lesen
Autoren: jQuery Community Experts

Vom Netzwerk:

Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

text

Mittlerer Text

text

Die erste
alert()
-Anweisung im Code enthält eine jQuery-Anweisung, mit der das Dokument nach allen

-Elementen durchsucht wird. Dann werden per
filter()
aus den selektierten

-Elementen im Set nur die ausgewählt, die die Klasse
middle
besitzen. Die Eigenschaft
length
beschreibt dann, wie viele Elemente im Set verblieben sind:
alert(jQuery('p').filter('.middle').length); //gibt 1 aus
    Die nächste
alert()
-Anweisung nutzt die Methode
end()
. Wir gehen genauso vor wie bei der vorherigen Anweisung, nur dass wir die Methode
filter()
rückgängig machen und damit das Set mit den Elementen zurückgeben, die sich vor dem Anwender der Methode
filter()
im Wrapper-Set befanden:
alert(jQuery('p').filter('.middle'). end() .length); //gibt 3 zurück
    Die letzte
alert()
-Anweisung zeigt, wie die Methode
end()
zwei Mal genutzt wird, um beide destruktive Änderungen
filter()
und
find()
zurückzunehmen und damit das Wrapper-Set in seinen Ursprungszustand zurückzuversetzen:
alert(jQuery('p').filter('.middle').find('span') .end().end() .length); //gibt 3 zurück
    Diskussion
    Wenn die Methode
end()
genutzt wird, obwohl vorher keine destruktiven Operationen durchgeführt wurden, wird ein leeres Set zurückgegeben. Dabei handelt es sich bei einer destruktiven Operation um eine solche, die die Menge der gefundenen jQuery-Elemente ändert – somit also alle durchlaufenden oder verändernden Methoden, die ein jQuery-Objekt zurückgeben. Dazu gehören
add()
,
andSelf()
,
children()
,
closes()
,
filter()
,
find()
,
map()
,
next()
,
nextAll()
,
not()
,
parent()
,
parents()
,
prev()
,
prevAll()
,
siblings()
,
slice()
,
clone()
,
appendTo()
,
prependTo()
,
insertBefore()
,
insertAfter()
und
replaceAll()
.

Die vorherige Selektion mit der aktuellen Selektion vereinigen
    Problem
    Sie haben ein Set mit Elementen bearbeitet, um zu einem neuen Set zu gelangen, wollen aber sowohl mit dem neuen wie auch mit dem alten Set arbeiten.
    Lösung
    Sie können eine vorherige Selektion von DOM-Elementen mit der aktuellen Selektion kombinieren, indem Sie die Methode
andSelf()
nutzen.So selektieren wir zum Beispiel im folgenden Code zunächst alle

-Elemente auf der Seite. Dann ve rändern wir dieses Set mit Elementen, indem wir alle

-Elemente innerhalb der

-Elemente auswählen. Um nun sowohl auf den

- wie auch auf den

-Elementen innerhalb der

-Elemente zu arbeiten, können wir die

-Elemente in das aktuelle Set mit Hilfe der Methode
andSelf()
übernehmen. Würden wir
andSelf()
weglassen, würde die Rahmenfarbe nur auf die

-Elemente angewendet werden:
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Absatz

    Diskussion
    Nutzen Sie die Methode
andSelf()
, dann wird nur das aktuelle Set mit dem direkt vorher genutzten vereinigt, nicht mit allen vorherigen Sets.

Das DOM basierend auf dem aktuellen Kontext durchlaufen, um ein neues Set mit DOM-Elementen zu erhalten
    Problem
    Sie haben ein Set mit DOM-Elementen selektiert und wollen ausgehend von der Position der Selektionen in der DOM-Baumstruktur das DOM erneut durchlaufen, um ein neues Set mit Elementen zu erhalten.
    Lösung
    jQuery stellt eine Reihe von Methoden bereit, mit denen das DOM abhängig vom Kontext der aktuell selektierten DOM-Elemente durchlaufen werden kann.
    Lassen Sie uns zum Beispiel den folgenden HTML-Schnipsel anschauen: