Merné jednotky v atribúte style v JavaScripte

Pri určovaní hodnôt vlastností cez atribút style musíme uvádzať merné jednotky:

elem.style.width = '100px';

Pri čítaní hodnôt budú tiež získavané s mernými jednotkami:

let width = elem.style.width;
console.log(width); // vypíše '100px';

V prípade potreby sa môžeme zbaviť merných jednotiek pomocou parseInt:

let width = elem.style.width;
console.log(parseInt(width)); // vypíše 100

Ak sa predpokladajú desatinné hodnoty, možno použiť funkciu parseFloat:

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

Daný div a tlačidlo. Po kliknutí na tlačidlo nastavte divu šírku na 400px, a výšku na 300px.

Daný div:

<div id="elem" style="width: 300px; height: 200px;">
	text
</div>

Dané aj tlačidlo. Po kliknutí na tlačidlo vypíšte šírku a výšku divu bez merných jednotiek.

Daný div:

<div id="elem" style="font-size: 1.5em;">
	text
</div>

Dané aj tlačidlo. Po kliknutí na tlačidlo vypíšte veľkosť písma divu bez merných jednotiek.