Rolf B: finde nächstgelegenes Element mit bestimmter Klasse

Beitrag lesen

Hallo Berta,

ja, sorry, so schnell geht's nicht immer 😉

Es ist wirklich blöd, dass querySelector grundsätzlich nur seine Kinder befragt und nicht links oder rechts gucken kann.

Der Aufruf querySelector("#eineId ~ .eineKlasse") funktioniert, sofern dein Bezugselement eine ID hat. Wenn nicht, geht das nicht. Und natürlich könnte man einwenden, dass der Browser erstmal der Selektor parsen und das Element mit der ID heraussuchen muss, das ist aber ein schwacher Einwand, weil genau diese Stellen höchstes Augenmerk der Optimierer haben.

Die MooTools haben einen Satz Methoden, um eine generische CSS Suchmaschine namens "Slick" herum, um Nachbarn relativ zu einem Element zu finden. Ohne ID. Aber man muss nicht immer gleich die Kuh auf's Eis führen - man kann auch selber ein JS Funktiönchen schreiben und an den Element-Prototyp kleben:

Element.prototype.getNextSibling(selector) {
   let elem = this;
   while (elem = elem.nextElementSibling) {
      if (!selector || elem.matches(selector))
        return elem;
   }
   return null;
}

Und dann hast Du eine hübsche Methode am Element-Objekt.

let spIF = document.getElementById("speziellesInputFeld");
let spC = spIF.getNextSibling(".spezielleKlasse");

Rolf

--
sumpsi - posui - obstruxi