Selektoren und Filter

Einfache Selektoren

• a --- Alle Elemente vom angegebenen Type, hier alle Links <a>
• #myid --- Das Element mit der ID myid. Normalerweise sind IDs im Dokument eindeutig sodass genau ein Element zurückgegeben wird, aber fehlerhafte Dokumente und fehlertolerante Browser können auch ein Array aus mehreren Elementen liefern.
• .myclass --- Alle Elemente der Klasse myclass
• .classA .classB --- Alle Elemente, welchen die Klassen classA und classB zugewiesen sind
• * --- Alle Elemente des Dokuments
• Selektor1, Selektor2, ... Alle Elemente auf welche mindestens ein aufgezählter Selektor passt

Hierarchische Selektoren

• ElementA ElementB --- Alle B-Elemente, welche innerhalb von ElementA eingebettet sind
• Eltern > Kind --- Alle direkten Kind-Elemente des Eltern-Elements
• ElementA + ElementB --- Alle B-Element, welche direkt auf ein A-Element folgen
• ElementA ~ ElementB --- Alle B-Element, welche Geschwister von ElementA sind

Methoden

<script type="text/javascript" src="jquery-1.4.min.js"></script>
<script type="text/javascript">
   // we will add our javascript code here
   $(document).ready(function() {
      $("#output").html("Das Dokument enthält: " + $("a").size() + " Links.");
   });
</script>

... html code mit Links ..

<div id="output"></div>

$("img[alt]").get(0);

$("p").index($("p#absatz_2"));

$("p").add("li")

$("li").not(:contains("Text"));

$("img").filter("[title*=Text]"));

$("li").slice(0,2));

Einfache Filter

Inhalts-, Sichtbarkeits- und Attributfilter

Elter-, Kindfilter

Filter für Formularelemente

weitere Methoden

$("p").find("#lorem");

if ($("*").is("table")) {
   $("#output").html("Das Dokument enthält Tabelle(n).");
}

if ($("#checkbox1").is(":checked")) {
   $("#output").html("checkbox 1 ist angekreuzt.");
}