Thêm lớp cho phần tử trong jQuery

Tôi xin nhắc lại rằng trong thuộc tính class trong mã HTML, bạn có thể viết nhiều lớp cách nhau bằng dấu cách.

Hãy tưởng tượng một tình huống như thế này - bạn muốn thêm một lớp mới vào các lớp hiện có, mà không ghi đè chúng. Trong trường hợp này, chỉ cần lấy và thực hiện .attr('class', 'new-class') sẽ không thành công (bằng cách sử dụng phương thức attr) - bạn sẽ ghi đè lên các lớp mà đã có trong thuộc tính.

Tất nhiên, trước tiên bạn có thể đọc các lớp, ở đó, sau đó thêm lớp của chúng ta vào chúng bằng dấu cách và ghi tất cả trở lại thuộc tính, nhưng có một cách dễ dàng hơn - trong jQuery cho những việc như vậy đã có phương thức addClass.

Phương thức addClass cho phép thêm lớp vào phần tử (hoặc các phần tử), mà không ghi đè các lớp khác. Lớp mà bạn muốn thêm vào phần tử, được chấp nhận làm tham số của phương thức này.

Trong ví dụ tiếp theo, chúng ta có một phần tử với hai lớp - class="www zzz":

Chúng ta có thể thêm vào nó lớp thứ ba - kkk. Kết quả là nội dung của thuộc tính sẽ trở thành như thế này - class="www zzz kkk":

Mã HTML sẽ trông như thế này: