Meeteenheden in het style attribuat in JavaScript

Bij het specificeren van eigenschapswaarden via het attribuut style moeten we meeteenheden opgeven:

javascriptelem.style.width = '100px';

Bij het uitlezen van waarden zullen deze ook worden verkregen met meeteenheden:

javascriptlet width = elem.style.width;
console.log(width); // geeft '100px' uit;

Indien nodig kunnen we de meeteenheden verwijderen met behulp van parseInt:

javascriptlet width = elem.style.width;
console.log(parseInt(width)); // geeft 100 uit

Als er fractionele waarden worden verwacht, kan je de functie parseFloat gebruiken:

javascriptlet width = elem.style.width;
console.log(parseFloat(width));

Задание 1

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.

Задание 2

Gegeven een div:

html<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.

Задание 3

Gegeven een div:

html<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.