JavaScript'te CSS Sınıfları ile Stillemenin Avantajı

Stilleri doğrudan değiştirmek yerine sınıfları kullanmanın bir avantajı daha vardır. Kolay bir el hareketiyle öğelerin stillerinin dönüşümlü olmasını sağlayabilirsiniz.

Örneğin, bir paragrafa ilk tıklandığında belirli bir renge boyanmasını, ikinci kez tıklandığında ise orijinal rengine dönmesini sağlayabilirsiniz. Bunun için sadece add metodunu toggle metodu ile değiştirmeniz yeterlidir:

javascriptlet elems = document.querySelectorAll('p');

for (let elem of elems) {
  elem.addEventListener('click', function() {
    this.classList.toggle('colored');
  });
}