Ногунории синфҳо дар JavaScript

Бигзор мо чанд синф барои услубдиҳии паёмҳо дошта бошем:

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

Бигзор дар баъзе элементҳо мо паёми муваффақро баровардаем ва барои он синфи мувофиқи муваффақиятро таъин кунем:

javascriptelem.classList.add('success');

Бигзор акнун мо дар ҳамин элемент паёми хаторо баровардаем ва барои он синфи мувофиқи хаторо таъин кунем:

javascriptelem.classList.add('error');

Дар натиҷа, дар элемент ду синфи бо ҳамдигар зиддияткунанда вуҷуд хоҳад дошт:

html<div id="elem" class="success error">
  матн
</div>

Маълум мешавад, ки пеш аз илова кардани синфи нав, мо бояд аввал синфи қаблиро ҳазв кунем:

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

Ин хеле фоидаовар нест, зеро мо метавонем надонистем, ки синфи қаблии аниқ кадом буд ва мо бояд ҳамаи синфҳоро пай дар пай ҳазв кунем:

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