JQuery Kochbuch (German Edition)

type="text/JavaScript">
jQuery('p'). html('Hallo Welt, ich bin ein <p>-Element.') ;
alert(jQuery('p'). html() );



    Führt man diesen Code in einem Browser aus, erhält man einen Alert mit dem HTML-Inhalt des

-Elements, welches wir vorher mit der Methode
html()
gesetzt und auch wieder damit ausgelesen haben.
    Diskussion
    Diese Methode nutzt die DOM-Eigenschaft
innerHTML
,um HTML-Codeabschnitte auszulesen und zu setzen. Sie sollten darauf achten, dass
html()
für XML-Dokumente nicht zur Verfügung steht (es funktioniert aber mit XHTML-Dokumenten).

Text-Inhalte lesen und setzen
    Problem
    Sie müssen den Text innerhalb eines oder mehrerer HTML-Elemente lesen oder setzen.
    Lösung
    jQuery stellt die Methode
text()
bereit,um den Text-Inhalt von Elementen auszulesen oder zu setzen. Im folgenden Code nutzen wir diese Methode, um den Text-Wert des

-Elements im HTML-Dokument zu setzen und auszulesen:
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    Führt man diesen Code in einem Browser aus, erhält man einen Alert mit dem Inhalt des

-Elements, welches wir vorher mit der Methode
text()
gesetzt und auch wieder damit ausgelesen haben.
    Diskussion
    Es ist wichtig, sich daran zu erinnern, dass die Methode
text()
der Methode
html()
ähnelt, mit der Ausnahme, dass
text()
HTML-Code maskiert (
<
und
>
durch ihre HTML-Entitäten ersetzt). Haben Sie also Tags innerhalb des Text-Strings, der an die Methode
text()
übergeben wird, werden diese in ihre HTML-Entitäten umgewandelt (
<
und
>
).

Den $-Alias verwenden, ohne globale Konflikte zu erzeugen
    Problem
    Sie wollen den Alias
$
nutzen, anstatt den globalen Namespace anzugeben (jQuery), ohne sich um globale Konflikte sorgen zu müssen.
    Lösung
    Die Lösung ist hier, eine anonyme, sich selbst aufrufende Funktion zu erstellen, die wir dem jQuery-Objekt übergeben. Dann nutzen wir das
$
-Zeichen als Parameter-Zeiger auf das jQuery-Objekt.
    So könnte zum Beispiel der gesamte jQuery-Code in folgender, sich selbst aufrufender Funktion gekapselt werden:
(function( $ ){ //Funktion zum Erzeugen eines privaten Scopes mit dem
    //$-Parameter und zum Verwenden von $ ohne Konflikte
})( jQuery ); //Aufruf der anonymen Funktion und Übergabe an das jQuery-Objekt
    Diskussion
    Wir übergeben hier die globale Referenz auf jQuery an eine Funktion, die einen privaten Gültigkeitsbereich erzeugt. Würden wir das nicht tun und den Alias
$
im globalen Gültigkeitsbereich nutzen, hätten wir das Risiko, dass andere Skripten im HTML-Dokument (oder welche, die erst noch dazukommen), das Zeichen
$
nicht nutzen könnten. Warum sollten wir also das Risiko eingehen, wenn wir unseren eigenen, privaten Gültigkeitsbereich erzeugen können?
    Ein weiterer Vorteil besteht darin, dass Code innerhalb der anonymen, selbst-aufrufenden Funktion in seinem eigenen, privaten Gültigkeitsbereich läuft. Sie können ziemlich sicher davon ausgehen, dass kein Code innerhalb der Funktion einen Konflikt mit anderem JavaScript-Code im globalen Gültigkeitsbereich auslösen wird. Auch hier können wir also Kollisionen vermeiden, indem wir unseren privaten Gültigkeitsbereich erstellen.

Chapter 2. Elemente mit jQuery selektieren
    James Padolsey

Einführung
    Tief im Kern von jQuery steckt die Selektions-Engine,mit der Sie Elemente in einem Dokument basierend auf Namen, Attributen, Zuständen und so weiter selektieren können. Aufgrund der großen Popularität von CSS ist es sinnvoll, dessen Selektions-Syntax zu übernehmen, um in jQuery sehr einfach Elemente selektieren zu können. Neben der Unterstützung eines Großteils der Selektoren aus den CSS-Spezifikationen der Versionen 1 bis 3 bietet jQuery auch noch eine ganze Reihe eigener Selektoren an, mit denen man Elemente basierend auf bestimmten Zuständen oder Eigenschaften selektieren kann. Zusätzlich können Sie auch selbst Selektoren erzeugen! Dieses Kapitel behandelt einige der regelmäßig auftretenden Fragen beim Selektieren von Elementen mit jQuery.
    Vor dem