Zugriff auf DOM-Elemente

Eine der wesentlichen Aufgaben von JavaScript-Bibliotheken ist der einheitliche Zugriff auf DOM-Elemente innerhalb des HTML-Dokumentes auf Basis unterschiedlicher Filter. In der Regel geschieht das über Selektoren, die anhand eindeutiger IDs oder CSS-Styles eines oder mehrere Elemente im DOM-Baum auswählen.

Gehen wir im Folgenden von dieser einfachen HTML-Seite aus:

<h2>Ajax und DHTML mit CakePHP</h2>

<p id="textblock1" class="description">
        Das ist ein Beispieltext, der über den JsHelper angesprochen werden soll.
        <br />
        Wir werden sehen, was alles möglich ist.
</p>
<p id="textblock2" class="description">Das ist noch eine Zeile mit Text</p>

Wir haben hier zwei Absätze mit einem kurzen Text und eine dazu gehörende Überschrift in einem h2-Tag. Die beiden Absätze haben jeweils eine definierte ID im p-Tag, der diese eindeutig im DOM-Baum identifiziert. Darüber hinaus ist beiden Absätzen die Klasse description zugeordnet.