JavaScript-däki klasslaryň ulyşlyksyzlygy

Bizde habarlar üçin birnäçe stilizasiýa klasslary bolsun:

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

Diýmek, bir elementde üstünlikli habar görkezip, oňa degişli üstünlik klasyny belläýäris:

elem.classList.add('success');

Indi bolsa, şol elementde ýalňyşlyk habary görkezip, oňa degişli ýalňyşlyk klasyny belläýäris:

elem.classList.add('error');

Netijede, elementde bir-biri bilen çakyşýan iki klas bolýar:

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

Şonuň üçin, täze klas goşmanka, ilki öňki klasy aýyrmaly bolýarys:

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

Bu birneme ulyşlyksyz, sebäbi biz öňki klasyň haýsydygyny bilmesek hem mümkin we hemme klaslary bir hatarda aýyrmaly bolarys:

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

Bir input berlen. Fokusy ýitiren wagtyňyzda, içine 9 simwoldan köp däl girizilenligini barlaň. Eger şeýle bolsa, input-yň çägini ýaşyl reňke, ýogsa bolsa gyzyl reňke boýaň.