Moin,

ich habe HTML-Seiten (nicht PHP) mit Bildern <img src=...> und möchte ein Bildverzeichnis dieser Seite erstellen, also die Bilder im Kleinformat zeigen. Das ist zunächst leer:

<div id="thumbnails">
</div>

für jedes Bild soll so ein Eintrag eingefügt werden:

<div>
  <img src="[Dateiname]">
</div>

In Javascript mache ich dieses:

// Bildverzeichnis erstellen
var bilder = document.querySelectorAll( "img" );
console.log( bilder.length +" Bilder" );
thumbverzeichnis  = "";
for ( let i=0; i<bilder.length; i++ ) {
  console.log( bilder[i] );
  thumbverzeichnis  += "<div class='li bo'>\n";
  thumbverzeichnis  += bilder[i] +"\n";
  thumbverzeichnis  += "</div>\n";
}
document.querySelector( "#thumbnails"  ).innerHTML  = thumbverzeichnis;

Die Anzahl der Bilder wird korrekt gezeigt, mit console.log auch korrekt alle img-tags <img ...>

Aber nach Einfügen in #thumbnails wird nicht das Bild gezeigt, sondern sowas

Wie kann ich den String bekommen, den console.log anzeigt?

Gruß, Linuchs