Comment utiliser innerHTML pour changer un img avec une classe

Question

Je voudrais changer le img en utilisant Ajax. Mais la console dit "Impossible de définir la propriété 'innerHTML' de undefined", et le innerHTML ne fonctionne pas correctement. Comment puis-je changer le img qui a une classe type?

 var pokeIcon = document.getElementsByClassName("type"); 
     for(var k=0; k < pokeIcon.length; k++){ 
      pokeIcon[i].innerHTML = "<img src=\"" + data.images.typeIcon + "\">"; 
     } 

Le code HTML est écrit ci-dessous; (Il y a plusieurs éléments qui hace une classe type, et donc je ne peux pas utiliser id pour cela.

<img src="icons/normal.jpg" alt="type" class="type"/> 

Answer 1

Deux questions:

1. Votre compteur de boucle est k, mais que vous utilisez i dans l'attribution

2. Pour modifier la src d'une image, vous changez src, vous n'utilisez pas innerHTML

Alors:

var pokeIcon = document.getElementsByClassName("type"); 
for(var k=0; k < pokeIcon.length; k++){ 
    pokeIcon[k].src = data.images.typeIcon; 
    // ------^--^^^^^^^^^^^^^^^^^^^^^^^^^^ 
} 

---

Votre question titre est

Comment utiliser innerHTML pour changer une img avec une classe

... donc si c'est vraiment votre question, la réponse est la suivante: Vous ne pouvez pas raisonnablement faire ça. Vous devez définir le innerHTML de l'élément parent, ce qui signifierait détruire et recréer tous ses éléments descendants (ce qui supprimerait leurs gestionnaires d'événements, s'ils en ont).

Vous pourriez être en mesure de le faire avec outerHTML, mais src est le meilleur moyen.

Answer 2

vous devez écrire "k" au lieu de "i"

Answer 3

Ne pas utiliser innerHTML pour les images. Utilisez .src pour la même.

pokeIcon[k].src = data.images.typeIcon; 

Answer 4

Vous pouvez utiliser le sélecteur de requête et propriété src.

var images = document.querySelectorAll('img.type'); 
var i = 0, limit = images.length; 
for(i=0; i<limit; i++){ 
    images[i].src = data.images.typeIcon; 
} 

Answer 5

Vous pouvez simplement définir l'attribut src, de toute façon le problème est que vous utilisez la variable k pour la boucle et la variable i pour définir la source de l'image.

Pour définir src de l'image, voir ci-dessous s'il vous plaît:

var img = document.getElementsByClassName("type"); 
 
for(var k=0; k < img.length; k++){ 
 
    img[k].src = "http://www.maglioccola.com/images/stackoverflow.png"; 
 
}

<img class="type">

J'espère que cela vous aide, au revoir.