Lợi thế của việc tạo kiểu bằng lớp CSS trong JavaScript

Việc sử dụng các lớp thay vì thay đổi kiểu trực tiếp còn có một lợi thế khác. Chỉ với một động tác nhẹ nhàng, bạn có thể làm cho kiểu của các phần tử thay đổi luân phiên.

Ví dụ, bạn có thể làm sao cho khi nhấp chuột lần đầu vào một đoạn văn, nó sẽ đổi sang một màu nhất định, còn khi nhấp chuột lần thứ hai - nó sẽ trở về màu ban đầu. Để làm điều này, bạn chỉ cần thay phương thức add bằng phương thức toggle:

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

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