Не выводится функция, почему?

Question

[dualdeazz]

Есть вот такой вот код:

let sliderChange = (img) => {
       let items = document.querySelectorAll('.option-item .option-link');
    for (let i = 2; i < items.length; i++) {items[i].addEventListener('click',(e) => {
     console.log(e.currentTarget.href);
     if(e.currentTarget.href === 'javascript://%D0%94%D1%83%D0%BE') {
         img[0].src = "https://www.snopud.com/wp-content/uploads/2021/10/EVResidential800px-555x310.jpg";
         img[5].src = "https://www.snopud.com/wp-content/uploads/2021/10/EVResidential800px-555x310.jpg";
         img[1].src = "http://media.comicbook.com/2018/03/screen-shot-2018-03-15-at-115443-am-555x310-1093638.jpeg";
         img[6].src = "http://media.comicbook.com/2018/03/screen-shot-2018-03-15-at-115443-am-555x310-1093638.jpeg";
         img[2].src = "https://www.pokcas.com/wp-content/uploads/2021/01/Main-image-555x310.jpg";
         img[7].src = "https://www.pokcas.com/wp-content/uploads/2021/01/Main-image-555x310.jpg";
         img[3].src = "https://media.comicbook.com/2017/12/screen-shot-2017-12-08-at-11-56-52-pm-555x310-1064507.png";
         img[8].src = "https://media.comicbook.com/2017/12/screen-shot-2017-12-08-at-11-56-52-pm-555x310-1064507.png";
         img[4].src = "https://1dwfr82hjsxj44r7f73jl9qu-wpengine.netdna-ssl.com/wp-content/uploads/2015/06/Steve-555x310.jpg";
         img[9].src = "https://1dwfr82hjsxj44r7f73jl9qu-wpengine.netdna-ssl.com/wp-content/uploads/2015/06/Steve-555x310.jpg";
         
         };
         if(e.currentTarget.href === 'javascript://%D0%A2%D1%80%D0%B8%D0%BE') {
         img[0].src = "/content/images/products/products-slider/calendars/quart/1.jpg?photolabId=6094&v=CA36475CC13AF750A09BBE3D9CCED4D0";
         img[5].src = "/content/images/products/products-slider/calendars/quart/1.jpg?photolabId=6094&v=CA36475CC13AF750A09BBE3D9CCED4D0";
         img[1].src = "/content/images/products/products-slider/calendars/quart/2.jpg?photolabId=6094&v=A41CE51880DDD456F059EBDA7113E670";
         img[6].src = "/content/images/products/products-slider/calendars/quart/2.jpg?photolabId=6094&v=A41CE51880DDD456F059EBDA7113E670";
         img[2].src = "/content/images/products/products-slider/calendars/quart/3.jpg?photolabId=6094&v=929AD93C8E6550B7323713B55651BC9C";
         img[7].src = "/content/images/products/products-slider/calendars/quart/3.jpg?photolabId=6094&v=929AD93C8E6550B7323713B55651BC9C";
         img[3].src = "/content/images/products/products-slider/calendars/quart/4.jpg?photolabId=6094&v=055530673FC2C16F27F50E3C25A2159A";
         img[8].src = "/content/images/products/products-slider/calendars/quart/4.jpg?photolabId=6094&v=055530673FC2C16F27F50E3C25A2159A";
         img[4].src = "/content/images/products/products-slider/calendars/quart/5.jpg?photolabId=6094&v=F87451F01B09D27B3883B5089CE321EC";
         img[9].src = "/content/images/products/products-slider/calendars/quart/5.jpg?photolabId=6094&v=F87451F01B09D27B3883B5089CE321EC";
         
         };
    })};
    };
    
    setTimeout(sliderChange(document.querySelectorAll('.swiper-slide img')),500);

который должен при наличии определенного атрибута у ссылки менять все картинки в слайдере, код работает, если функцию вызвать через консоль, однако без вызова в консоли она не работает, почему?

Answer 1

[defriz]

- setTimeout(sliderChange(document.querySelectorAll('.swiper-slide img')),500);
+ setTimeout(() => sliderChange(document.querySelectorAll('.swiper-slide img')),500);

Answer 2

[Rsa97]

Вы вызываете функцию в момент создания таймера, а не после его срабатывания. Видимо, в этот момент в DOM нет элементов с селектором .option-item .option-link
Попробуйте так:

setTimeout(
  () => { sliderChange(document.querySelectorAll('.swiper-slide img')); },
  500
);

Но лучше привязаться к какому-то событию. Например, к окончанию загрузки страницы или к появлению нужного элемента (через MutationObserver).