Как использовать innerHTML, чтобы изменить img с классом

Я хотел бы изменить img с помощью Ajax. Но консоль говорит: "Невозможно установить свойство innerHTML из неопределенного", и innerHTML Не работает должным образом. Как я могу изменить img у которого есть класс type?

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

HTML написан ниже; (есть несколько элементов, которые имеют класс typeи поэтому я не могу использовать id за это.

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

5 ответов

Решение

Два вопроса:

  1. Ваш счетчик циклов k, но вы используете i в назначении

  2. Чтобы изменить src изображения, вы меняете srcВы не используете innerHTML

Так:

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

Ваш вопрос название

Как использовать innerHTML, чтобы изменить img с классом

... так что, если это действительно ваш вопрос, ответ: вы не можете разумно сделать это. Вы должны установить innerHTML родительского элемента, что означало бы уничтожение и воссоздание всех его дочерних элементов (которые удалили бы их обработчики событий, если они есть).

Вы могли бы сделать это с outerHTML, но src это лучший способ.

Вы должны написать "к" вместо "я"

Вы можете использовать селектор запросов и свойство 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;
}

Не используйте innerHTML для изображений. Используйте.src для того же.

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

Вы можете просто установить src атрибут, в любом случае проблема в том, что вы используете переменную k для цикла и переменной i установить источник изображения.

Чтобы установить src изображения, смотрите следующее:

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

Я надеюсь, это поможет вам, пока.

Другие вопросы по тегам