Wie benutze innerHTML, um ein IMG mit einer Klasse zu ändern

Question

Ich möchte die img mit Ajax ändern. Aber die Konsole sagt "Kann die Eigenschaft 'innerHTML' nicht definiert", und die innerHTML funktioniert nicht richtig. Wie kann ich die img ändern, die eine Klasse type hat?

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

HTML ist unten geschrieben; (Es gibt mehrere Elemente, die eine Klasse hace type, und so kann ich nicht id für diese.

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

Answer 1

Zwei Fragen:

1. Ihr Schleifenzähler ist k, aber Sie verwenden i in der Zuordnung

2. Um die src eines Bildes zu ändern, ändern Sie src, die Sie nicht verwenden innerHTML

So:

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

---

Sie fragen Titel

ist

Wie innerHTML- verwenden, um einen img mit einer Klasse

... so zu ändern, wenn die wirklich Ihre Frage ist, lautet die Antwort: Das kann man vernünftigerweise nicht tun. Sie müssten innerHTML des übergeordneten Elements festlegen, was bedeuten würde, alle seine untergeordneten Elemente zu zerstören und neu zu erstellen (wodurch ihre Event-Handler entfernt würden, falls sie welche hätten).

Sie können es möglicherweise mit outerHTML tun, aber src ist der beste Weg.

Answer 2

Sie müssen „k“ schreiben statt „i“

Answer 3

Verwenden innerHTML- nicht für Bilder. verwenden Sie .src für das gleiche.

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

Answer 4

Sie Abfrage-Selektor und src-Eigenschaft verwenden können.

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

Sie könnten einfach das src Attribut festlegen, trotzdem ist das Problem, dass Sie die Variable k für die Schleife und die Variable i verwenden, um die Bildquelle festzulegen.

src des Bildes einzustellen, siehe folgende bitte:

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">

Ich hoffe, es hilft Ihnen, bye.