When specifying property values via
the style attribute, we must
specify measuring units:
elem.style.width = '100px';
When reading values, they will also be obtained with units:
let width = elem.style.width;
console.log(width); // shows '100px';
If necessary, we can get rid of
units with parseInt:
let width = elem.style.width;
console.log(parseInt(width)); // shows 100
If fractional values are expected,
you can use the parseFloat function:
let width = elem.style.width;
console.log(parseFloat(width));
Given a div and a button. On button
click, set the width of the div to
400px and the height to
300px.
Given a div:
<div id="elem" style="width: 300px; height: 200px;">
text
</div>
There is also a button. On button click display the width and height of the div without units.
Given a div:
<div id="elem" style="font-size: 1.5em;">
text
</div>
There is also a button. By clicking on this button, display the font size of the div without measuring units.