Selektoren

Mit Hilfe von Constraints lassen sich innerhalb vom DOM Nodes Elemente suchen.

CSS-Klassen

Häufig will man Nodes die eine bestimmte CSS-Klasse besitzen herausfinden. Mit Hilfe des Selector-Constraint¹ lassen sich ähnliche Suchen wie mit JQuery durchführen. Als Beispiel nehmen wir folgendes HTML und speichern die Zeichenkette in der Variable $html ab.

<div>
    <article>
        Das ist der <b>Text</b> mit einem bold-Tag! 
        <ul>
            <li id="opt1">Option 1</li>
            <li id="opt2" class="selected">Option 2</li>
            <li id="opt3">Option 3</li>
        </ul>
    </article>
</div>

Daraus erstellen wir dann eine Node-Struktur und führen die Suchen aus.

$fragment=\Alvine\Markup\Html\Fragment::getInstanceFromString($html);

echo (string) $fragment->find(new \Alvine\Markup\Html\Constraint\Selector('#opt2[class]'));
// -> <li id="opt2" class="selected">Option 2</li>

echo (string) $fragment->find(new \Alvine\Markup\Html\Constraint\Selector('li[class!="selected"]'));
// -> <li id="opt1">Option 1</li><li id="opt3">Option 3</li>

Attribute

Was mit CSS-Klassen funktioniert, funktioniert auch mit allgemeinen Attribute einer Node. Dazu kann das Attribute-Constraint verwendet werden. Es lassen sich einzelne Abfragen, aber auch kombinierte Abfragen - z.B. AND, OR - durchführen.

$html=\Alvine\Markup\Html\Fragment::getInstanceFromString('
<div>
    <article>
        <ul>
            <li data-example="nocontent">Option 1</li>
            <li data-example="content">Option 2</li>
        </ul>
    </article>
</div>
');

echo (string) $html->find(new \Alvine\Markup\Html\Constraint\Attribute('data-example'));
// -> <li data-example="nocontent">Option 1</li><li data-example="content">Option 2</li>
echo "\n";
/** Elemente mit dem Attribute "data-example" UND dem Wert des Attributes "content" */
echo (string) $html->find(new \Alvine\Util\Constraint\AndOperator(
    new \Alvine\Markup\Html\Constraint\Attribute('data-example'), new \Alvine\Markup\Html\Constraint\AttributeValue('content')));
// -> <li data-example="content">Option 2</li>

Manipulation der Ergebnisse

Nach einer erfolgreichen Suche möchte man das Ergebnis manipulieren. Da das Ergebnis eine Node-Struktur von Elementen ist, können hier ganz einfach Manipulationen mit den bestehenden Node-Methoden - wie z.B. Node::appendChild() - durchgeführrt werden.

Wichtig

Das Ergebnis von NodeList::find() ist immer eine vom Dokument unabhängige NodeList. Um auf die Elemente zugreifen zu können, müssen diese direkt angepsrochen werden.

$html=\Alvine\Markup\Html\Fragment::getInstanceFromString('
<div>
    <article>
        <p class="first"></p>
        <p>Lorem Ipsum</p>
    </article>
</div>
');

$node=$html->find(new \Alvine\Markup\Html\Constraint\Attribute('class'));
// -> Das Ergebnis ist eine Nodelist

$current=$node->current();
$current->appendChild(new \Alvine\Markup\Html\Element\Html\H1('my headline'));

echo (string) $html;
// -> <div>
//      <article>
//          <p class="first"><h1>my headline</h1></p>
//          <p>Lorem Ipsum</p>
//      </article>
//    </div>

---

1. Constraint sind in Klassen definierte Bedingungen für die Suche. ↩