Opera und Selectors API

Eine schöne Sache ist die Implementation von Selektoren in DOM und Javascript bei Opera. Jetzt werden natürlich alle sagen: Das gibt es doch bei CSS schon – aber das ist nicht gemeint. Es geht um den Zugriff auf DOM-Objekte per Selektoren wie bei CSS.

Ein Beispiel kann dies besser verdeutlichen.
Es existiere folgendes HTML-Fragment einer Liste mit Checkboxen für Autos:

<ul id="cars">
  <li><input type="checkbox" name="car" value="open"> Manta</li>
  <li><input type="checkbox" name="car" value="porsche"> Porsche</li>
  <li><input type="checkbox" name="car" value="vw"> Käfer</li>
  <li><input type="checkbox" name="car" value="veb"> Trabbi</li>
</ul>

Beispielsweise würde auf Zugriff auf alle Autos, die selektiert sind so vorgegangen:

var autos = document.getElementById("cars");
var checkboxen = autos.getElementsByTagName("input");
var liste = [];
for (var i = 0; i < checkboxen.length; i++) {
  if (checkboxen[i].checked) {
    liste.push(checkboxen[i]);
  }
}

Mit der Selectors API geht es kurz und einfach so:

var liste = document.querySelector("#cars input:checked");

Schöne Sache. Erpart viel Arbeit.

Weitere Beispiele und ein ausführlicher Artikel auf Operas Core-Blog.