@@Linuchs

Ich brauche vom img-Objekt den src Wert und - danke für die Anregung - den alt Wert, und schon funktioniert es prächtig:

Zu der Einschätzung kannst du nur gelangt sein, weil du nicht getestet hast. Aber man sieht den Fehler auch schon im Code.

Übrigens wäre es schön, wenn du bei Codeblöcken immer die Sprache (hier: JavaScript) angibst, dann gibt’s auch Syntax-Highlighting. Ich hab das mal für dich gemacht.

var bilder            = document.querySelectorAll( ".bo img" );
var thumbverzeichnis  = "";

var? Das sollte anno 2026 nicht mehr auftauchen.

bilder verändert sich nicht mehr, thumbverzeichnis hingegen doch. Also:

const bilder = document.querySelectorAll( ".bo img" );
let thumbverzeichnis = "";

for ( let i=0; i<bilder.length; i++ ) {

Immer noch? Warum?

  thumbverzeichnis  += "<div class='li bo'>";
  thumbverzeichnis  += "<img src='" +src +"' alt='" +alt +"'>";
  thumbverzeichnis  += (i+1) +". " +alt;
  thumbverzeichnis  += "</div>";

Das ist unlesbarer Code. So wird’s lesbar:

  thumbverzeichnis += `<div class='li bo'>
    <img src='${src}' alt='${alt}'>
    ${i+1}. ${alt}
  </div>`;

Und jetzt ist auch der Fehler deutlich zu sehen: alt wird zweimal ausgegeben, von Screenreadern also zweimal vorgelesen. Das will man nicht, es ist hier alt='' zu setzen, so wie es auch in meinen bereits verlinkten Beispielen der Fall ist. Die hattest du dir angesehen?

  thumbverzeichnis += `<div class='li bo'>
    <img src='${src}' alt=''>
    ${i+1}. ${alt}
  </div>`;

Du willst die Bilder durchnummerieren? Das deutet darauf hin, dass du ol/li verwenden willst anstatt div.

🖖 Live long and prosper