'Reported problem in the Javascript of my website

My website has a simple slide carousel which works correctly, but the SEOptimer evaluation report says:

“Cannot read property 'className' of undefined at showSlides (http://www.abacus-arts.org.uk/:78:8) ”

Line 78 is near the end below and says: dots[slideIndex-1].className += " active";

Can I safely ignore the SEOptimer problem report, or can you help me to fix it?

<div>
<!-- code for slides 1 to 4 removed, below are slides 5 and 6 in the carousell -->
  <div class="mySlides">
    <div class="picnumber"> 5 / 6</div> <img src="Pic-5-DM.jpg" alt="Pic5" style="width:100%";> 
     <div class="pictitle"> Breakout room LHS view                      </div> </div>
  <div class="mySlides">
    <div class="picnumber"> 6 / 6</div> <img src="Pic-6-GW.jpg" alt="Pic6" style="width:100%";> 
     <div class="pictitle"> Street view of entrance  </div> </div>
 <!-- Back and forward buttons jump to the Java Script lower down -->
  <a class="prev" onclick="plusSlides(-1)"> &lt;</a>
  <a class="next" onclick="plusSlides(1)">  &gt;</a>
</div>
 <!-- from https://www.w3schools.com/howto/howto_js_slideshow_gallery.asp -->
<script>
var slideIndex = 1;
showSlides(slideIndex);
 function plusSlides(n)   {   showSlides(slideIndex += n); }
 function currentSlide(n) {   showSlides(slideIndex = n);  }
 function showSlides(n)   {   var i;
   var slides = document.getElementsByClassName("mySlides");
//   var dots = document.getElementsByClassName("demo");
//   var captionText = document.getElementById("caption");
   if (n > slides.length) {slideIndex = 1                }
   if (n < 1)             {slideIndex = slides.length    }
   for (i = 0; i < slides.length; i++) { slides[i].style.display = "none";  }
//   for (i = 0; i < dots.length; i++)  
//   { dots[i].className = dots[i].className.replace(" active", "");  }
   slides[slideIndex-1].style.display = "block";
//   dots[slideIndex-1].className += " active";
//  captionText.innerHTML = dots[slideIndex-1].alt;  
 }
</script>

UPDATE. Solved by removing the lines for unused variables as shown //.

javascripthtml


Solution 1:[1]

@phuzi Thank you all for encouraging me to search for unused variables, I found in evolving the HTML I has stopped using "demo, dots and captiontext" and the problem went away when these code lines were excluded.
Many thanks. Graeme.

Solution 2:[2]

 var dots = document.getElementsByClassName("demo");

there is null, it mean - i dont find any classes with name "demo" check html part code

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Graeme
Solution 2 Роман Зыков

Related Questions