Ошибка "Uncaught TypeError: Cannot set properties of null (setting 'innerHTML')"

Пишу лабу и в фрагменте

function generateLot() {
	
	var lotArray =
		['<img src="lot/1.jpg">',
			'<img src="lot/2.jpg">',
			'<img src="lot/3.jpg">',
			'<img src="lot/4.jpg">',
			'<img src="lot/5.jpg">'];

	for(i = 0; i < 9; i++) {
		
		var rand = (Math.floor(Math.random() * 5) + 1);
		
		var randL = Math.floor(Math.random() * lotArray.length);
		var randLot = lotArray[randL];
		var lotTag = document.getElementById('img-' + i);
		lotTag.innerHTML = randLot;
	}
}

Ошибка возникает в конце (lotTag.innerHTML = randLot;)
Вроде же все норм, не пойму что не так

Ошибка говорит о том что var lotTag = document.getElementById('img-' + i); это выражение вычисляется в null. Самые вероятные причины в твоем случае.

  1. На странице нет элемента с айди 'img-' + i.
  2. Код выполняется до события готовности DOM, например когда запуск скрипта в исходном коде страницы раньше разметки с которой скрипт работает.

давай дебажить чтобы понять с каким случаем имеем дело (возможно просто описка)

var lotTag = document.getElementById('img-' + i);
console.log(lotTag, 'img-' + i)

посмотри значения в консоли, ты ожидаешь видеть элементы и их айдишники. А что видишь? Почему думаешь так?

Ошибка была в том что отчет начинался с нуля, а у меня элементы начинаются от одного.
Я прост приравнял i = 1. Спасибо что помогли разобратся

1 лайк