JavaScript-те класстардың ыңғайсыздығы

Бізде хабарламаларды стильдеу үшін birneşe klas bar bolsyn:

css.success {
  color: green;
}
.warning {
  color: orange;
}
.error {
  color: red;
}

Біз қандай да бір elementte tabysty habarlamany shyғardyқ jäne oғan sättiq tïimdi klas tayyndadyq:

javascriptelem.classList.add('success');

Endi sol elementte қате туралы хабарлама шығарып, оған қате үшін сәйкес келетін klas tayyndaymyz:

javascriptelem.classList.add('error');

Нәтижесінде elementte bir-birimen jaқtastasan eki klas bolady:

html<div id="elem" class="success error">
  text
</div>

Şeşenimen, jaña klas qospar aldın, bizğe aldıngı klasты өшіру керек:

javascriptelem.classList.remove('success');
elem.classList.add('error');

Бұл өте ыңғайсыз, себебі біз алдыңғы klas қандай екенін білмейміз және бізге барлық klasтарды кезекпен өшіруге тура келеді:

javascriptelem.classList.remove('success');
elem.classList.remove('warning');
elem.classList.add('error');