Stílusosztályok alkalmazása JavaScriptben
Az elemek stílusozása a style attribútumon keresztül
néha kényelmes, de legtöbbször - nem a legjobb
ötlet. A probléma az, hogy a stílusok
szétszóródnak a JavaScript fájlban,
és nehézkes lesz őket módosítani.
Sokkal kényelmesebb a stílusokat CSS fájlokban
megadni, hogy könnyen lehessen módosítani őket
anélkül, hogy a JavaScript kódot kellene bolyongatni.
Legyen például egy elemünk, amely kiír valamilyen üzenetet. Az üzenet lehet "jó" és zöld színnel jelenik meg, vagy "rossz" és piros színnel jelenik meg. A legjobb megoldás ebben az esetben az, hogy készítünk hozzá a megfelelő CSS osztályokat:
.success {
color: green;
}
.error {
color: red;
}
Most a "jó" üzenet kiírásakor megadjuk az elemnek a "jó" osztályt:
elem.textContent = 'good';
elem.classList.add('success');
A "rossz" üzenet kiírásakor pedig megadjuk az elemnek a "rossz" osztályt:
elem.textContent = 'bad';
elem.classList.add('error');
Adottak számokat tartalmazó bekezdések. Járja be ezeket a bekezdéseket ciklussal, és a páros számot tartalmazó bekezdéseket színezze pirosra, a páratlant tartalmazókat pedig zöldre.
