FAQ-Accordion

Community feedback

• 

  Grego•1,310

  @Grego14Posted 7 months ago

  Hello! There is one thing I would change in your JavaScript code to make better use of memory and improve performance: it is the way you add the event listener to each button. Although of course since it is not a project with so many listeners it may not affect performance much.

  for (i = 0; i < accordion.length; i++) {
  accordion[i].addEventListener('click', function () {
    this.classList.toggle('active')
   });
  }
  

  In this case you are making a loop to iterate through each button and add an eventListener.

  I recommend that you use event delegation. Here is a link that explains it: event delegation

  Changing your code a little would look like this:

  document.addEventListener('click', function(e){
    if(e.target.classList.contains('accordion-questions')){
      e.target.classList.toggle('active')
    }
  })
  

  And here you would be adding only one eventListener to handle the 4 accordions

  I hope this helps!

  Marked as helpful

  0