Tengo un problema al usar la propiedad .src, debo usarla para cambiar imágenes en cada carga de la página html usando números generados aleatoriamente. Y por alguna razón, img.src no cambia la propiedad src de la identificación objetivo y detiene mi bucle "for" por algunas razones ... (El código se ejecuta en un archivo HTML separado) Aquí está el código js :
const images_for_you = [ './assets/Series/Aggretsuko.jpg', './assets/Series/AngelBeast.jpg', './assets/Series/Arcane.jpg', './assets/Series/BreakingBad.jpg', './assets/Series/BlackMirror.jpg', './assets/Series/BluePeriod.jpg', './assets/Series/Django.png', './assets/Series/GreatPretender.jpg', './assets/Series/Hilda.jpg', './assets/Series/JeVeuxMangerTonPancreas.jpg', './assets/Series/LaLigneVerte.jpg', './assets/Series/LeCupheadShow.jpg', './assets/Series/LesEnfantsDeLaBalaine.jpg', './assets/Series/LeVoyageTeChihiro.jpg', './assets/Series/QuoiQuilArriveJeVousAime.jpg', './assets/Series/NosMotsCommeDesBulles.jpg', './assets/Series/SkyHighSurvival.jpg', './assets/Series/toradora.jpg', './assets/Series/SkyHighSurvival.jpg', './assets/Series/Viking.jpg']; // 20 const images_japanese_animation = []; const images_netflix_originals = []; const images_films_sf = []; const images_studios_ghibli = []; const images_dessins_animes = []; function random_array(iterations){ var randomArray = []; for (let i = 0; i<iterations; i++){ randomArray.push(Math.floor(Math.random()*iterations)) } return randomArray } function attribute_for_you(number_of_images){ let randArr = random_array(number_of_images) let index_for_you = [ 'for_you_1', 'for_you_2', 'for_you_3', 'for_you_4', 'for_you_5', 'for_you_6', 'for_you_7', 'for_you_8', 'for_you_9', 'for_you_10', 'for_you_11', 'for_you_12', 'for_you_13', 'for_you_14' ] for (let i = 0; i < number_of_images; i++){ console.log(images_for_you[randArr[i]]) console.log(randArr[i]) console.log(i) var img_index = document.getElementsById(index_for_you[i]) img_index.src = images_for_you[randArr[i]] } } attribute_for_you(10)Gracias por su ayuda Además, las identificaciones son correctas, lo verifiqué varias veces :)
var img_index = documento.getElementsById(index_for_you[i])
getElementById se usa para obtener los elementos html con una identificación específica, pero está usando esto para obtener su variable JS, no es así como funciona, por lo que mostrará un error.
ACTUALIZADO
También debe agregar esos elementos de imagen a su cuerpo HTML si no están en su HTML
for (let i = 0; i < number_of_images; i++){ console.log(images_for_you[randArr[i]]) console.log(randArr[i]) console.log(i) var img_index = document.getElementById(index_for_you[i]) //if cannot find that image element, we need to add it if(!img_index) { imageElement = document.createElement('img'); imageElement.setAttribute("id", index_for_you[i]); //add the image element to the body document.body.appendChild(imageElement); } img_index = document.getElementById(index_for_you[i]) img_index.src = images_for_you[randArr[i]] }RESPUESTA ANTIGUA
Tienes un error de sintaxis aquí
var img_index = document.getElementsById(index_for_you[i]) Debería ser getElementById , no getElementsById (los Elements no deberían tener s )
El cambio debe ser
var img_index = document.getElementById(index_for_you[i])