JavaScript-də Siniflərin Narahatlığı

Tutaq ki, bizdə mesajların stilinqi üçün bir neçə sinif var:

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

Tutaq ki, hansısa elementdə uğurlu bir mesaj göstərdik və ona uyğun gələn uğur sinifini təyin etdik:

elem.classList.add('success');

Tutaq ki, indi biz həmin elementdə səhv mesajı göstərdik və ona uyğun gələn səhv sinifini təyin etdik:

elem.classList.add('error');

Nəticədə elementdə bir-biri ilə ziddiyyət təşkil edən iki sinif olacaq:

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

Belə çıxır ki, yeni sinif əlavə etməzdən əvvəl, əvvəlki sinifi silməliyik:

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

Bu çox əlverişli deyil, çünki biz əvvəlki sinfin nə olduğunu bilməyə bilərik və biz bütün sinifləri bir-bir silməli olacayıq:

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

Input verilib. Fokus itirildikdə yoxlayın ki, onun içinə 9 simvoldan çox daxil edilməyib. Əgər belədirsə, inputun sərhədini yaşıl rəngə boyayın, əks halda isə qırmızı.