Klasių nepatogumas JavaScript

Tarkime, kad turime keletą klasių pranešimų stilių:

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

Tarkime, kad kuriame nors elemente mes atvaizdavome sėkmingą pranešimą ir priskyrėme jam atitinkamą sėkmės klasę:

javascriptelem.classList.add('success');

Tarkime, kad dabar tame pačiame elemente atvaizdavome klaidos pranešimą ir priskyrėme jam atitinkamą klaidos klasę:

javascriptelem.classList.add('error');

Dėl to pasirodys, kad elemente bus dvi viena kitai prieštaraujančios klasės:

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

Pasirodo, kad prieš pridedant naują klasę, mums pirmiausia reikės pašalinti ankstesnę:

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

Tai nėra labai patogu, nes galime nežinoti, kokia tiksliai buvo ankstesnė klasė ir mums teks pašalinti visas klasės iš eilės:

javascriptelem.classList.remove('success');
elem.classList.remove('warning');
elem.classList.add('error');
Задание 1

Duotas įvesties laukas. Praradus fokusą patikrinkite, ar į jį įvesta ne daugiau kaip 9 simbolių. Jei taip, nudažykite įvesties lauko rėmelį žalia spalva, o jei ne - raudona.