Mis imágenes se están cargando muy lentamente en mi página, así que quiero agregar la carga diferida a las imágenes, las organicé así, traté de agregar img.setAttribute("loading", "lazy"); dentro de la function createImageNode(bilde) pero no hizo nada
Mi archivo Js:
const images = [ { fil: "Bff tanquery ikke redigert-11.jpg", class: "img-3"}, { fil: "Bff tanquery-2.jpg", class: "img-3"}, { fil: "Bff tanquery-3.jpg", class: "img-3"}, { fil: "Bff tanquery-9.jpg", class: "img-2"}, { fil: "Bff tanquery.jpg", class: "img-2"}, ]; function createImageNode(bilde) { const div1 = document.createElement("div"); const div2 = document.createElement("div"); const img = new Image(); img.src = `img/${bilde.fil}`; img.setAttribute("loading", "lazy"); div1.appendChild(div2); div1.classList.add(bilde.class); div2.appendChild(img); div2.classList.add('m2'); return div1; } function addImages() { const arrayImagesElement = document.getElementById("arrayImages"); images.forEach((img) => { arrayImagesElement.appendChild(createImageNode(img)); }); }Esto es lo que tengo en el archivo html para obtener las imágenes en la página.
<script type="text/javascript"> addImages(); </script>