Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

shahr's avatar
Level 10

Uncaught TypeError: prevButton is null

const slides = document.querySelectorAll('.slide');
const intervalTime = 5000;
let slideInterval;

const nextSlide = () => {
  // Get the current active slide
  const currentSlide = document.querySelector('.slide.active');
  // Remove the active class from the current slide
  currentSlide.classList.remove('active');
  // Check if there is a next slide
  if (currentSlide.nextElementSibling) {
    // If there is, add the active class to the next slide
    currentSlide.nextElementSibling.classList.add('active');
  } else {
    // If there isn't, add the active class to the first slide
    slides[0].classList.add('active');
  }
}

// Set up the slide interval
slideInterval = setInterval(nextSlide, intervalTime);

// Add event listeners to handle user interaction
const prevButton = document.querySelector('#prev');
const nextButton = document.querySelector('#next');

prevButton.addEventListener('click', () => {
  clearInterval(slideInterval);
  const currentSlide = document.querySelector('.slide.active');
  currentSlide.classList.remove('active');
  if (currentSlide.previousElementSibling) {
    currentSlide.previousElementSibling.classList.add('active');
  } else {
    slides[slides.length - 1].classList.add('active');
  }
  slideInterval = setInterval(nextSlide, intervalTime);
});

nextButton.addEventListener('click', () => {
  clearInterval(slideInterval);
  nextSlide();
  slideInterval = setInterval(nextSlide, intervalTime);
});
0 likes
2 replies
LaryAI's avatar
Level 58

The error "Uncaught TypeError: prevButton is null" means that the variable prevButton is null, which means that the element with the ID "prev" was not found in the HTML document. To fix this error, make sure that there is an element with the ID "prev" in the HTML document.

For example, add the following HTML code to the document:

<button id="prev">Previous</button>

This will create a button element with the ID "prev" that can be used to navigate to the previous slide.

Snapey's avatar

Are you sure you don't want to delete this question as well?

All are BASIC questions which could be answered with a simple google search and a little common sense.

1 like

Please or to participate in this conversation.