Meeteenheden in het style attribuat in JavaScript
Bij het specificeren van eigenschapswaarden
via het attribuut style moeten we
meeteenheden opgeven:
elem.style.width = '100px';
Bij het uitlezen van waarden zullen deze ook worden verkregen met meeteenheden:
let width = elem.style.width;
console.log(width); // geeft '100px' uit;
Indien nodig kunnen we de meeteenheden
verwijderen met behulp van parseInt:
let width = elem.style.width;
console.log(parseInt(width)); // geeft 100 uit
Als er fractionele waarden worden verwacht,
kan je de functie parseFloat gebruiken:
let width = elem.style.width;
console.log(parseFloat(width));
Gegeven een div en een knop. Stel bij het klikken op de knop
de breedte van de div in op 400px,
en de hoogte op 300px.
Gegeven een div:
<div id="elem" style="width: 300px; height: 200px;">
text
</div>
Ook is er een knop gegeven. Bij het klikken op de knop geef je de breedte en hoogte van de div weer zonder meeteenheden.
Gegeven een div:
<div id="elem" style="font-size: 1.5em;">
text
</div>
Ook is er een knop gegeven. Bij het klikken op de knop geef je de lettergrootte van de div weer zonder meeteenheden.
