Ошибка неперехваченного типа при использовании функции IIFE

#javascript

#javascript

Вопрос:

Я новичок в Javascript.Попытка присвоить фоновые изображения тегу div с помощью этой функции:

 (function(){
 
    var images=['image01.jpg','image04.jpg','image12.jpg','image22.jpg','image32.jpg','image42.jpg'];
    
    for(var index=0;index<=images.length;index  )
    {
    var images_class=document.querySelectorAll('.Image_c');
    
    let image_show=images[index];
    images_class[index].style.backgroundImage=`url(images/${image_show})`;
   
}})();
  

Стиль фонового изображения был правильно сопоставлен каждому div из 6 тегов div.
Однако существует неперехваченная ошибка, как показано ниже:

 Uncaught TypeError: Cannot read property 'style' of undefined
    at index2.js:10
    at index2.js:12
(anonymous) @ index2.js:10
(anonymous) @ index2.js:12
  

Кто-нибудь может помочь мне понять, что означает эта ошибка и как ее устранить?

Комментарии:

1. Это означает, что в вашем images массиве больше элементов, чем элементов в images_class списке узлов. Просто распечатайте images_class.length и images.length . Они не совпадают.

2. Я пробовал, показывает то же самое

3. 6 index2.js: 6 6 index2.js: 12 Неперехваченная ошибка типа: не удается прочитать свойство ‘style’ неопределенного значения в index2.js: 12 в index2.js: 14 (анонимный) @ index2.js: 12 (анонимный) @ index2.js:14

4. (function(){ var images=[‘image01.jpg ‘,’image04.jpg ‘,’image12.jpg ‘,’image22.jpg ‘,’image32.jpg ‘,’image42.jpg ‘]; console.log(изображения. длина); var x = document . querySelectorAll(‘.Image_c’); console.log(x.length); for(var index=0;index<=x.length;index ) { пусть image_show=images[index]; x[index].style.BackgroundImage= url(images/${image_show}) ; }})(); Ноошибка все еще отображается

Ответ №1:

Попробуйте выполнить цикл для объекта queryselector, поскольку длина массива изображений будет больше, чем длина объекта, возвращаемого из селектора запросов

 var images=['image01.jpg','image04.jpg','image12.jpg','image22.jpg','image32.jpg','image42.jpg'];
var x = document.querySelectorAll
for(var index=0;index<x.length;index  )
{

let image_show=images[index];
x[index].style.backgroundImage=`url(images/${image_show})`;
  

Комментарии:

1. (function(){ var images=[‘image01.jpg ‘,’image04.jpg ‘,’image12.jpg ‘,’image22.jpg ‘,’image32.jpg ‘,’image42.jpg ‘]; console.log(изображения. длина); var x = document . querySelectorAll(‘.Image_c’); console.log(x.length); for(var index=0;index<=x.length;index ) { пусть image_show=images[index]; x[index].style.BackgroundImage= url(images/${image_show}) ; }})();

2. Сообщение об ошибке: index2.js: 12 Ошибка неперехваченного типа: не удается прочитать свойство ‘style’ undefined в index2.js: 12 в index2.js:14 (анонимный) @ index2.js: 12 (анонимный) @ index2.js:14