Meeteenhede in die style attribuut in JavaScript

Wanneer ons waardes vir eienskappe spesifiseer deur die style attribuut, moet ons die meeteenhede aandui:

elem.style.width = '100px';

Wanneer waardes gelees word, sal hulle ook met die meeteenhede verkry word:

let width = elem.style.width;
console.log(width); // sal '100px' uitvoer;

Indien nodig kan ons van die meeteenhede ontslae raak met behulp van parseInt:

let width = elem.style.width;
console.log(parseInt(width)); // sal 100 uitvoer

As breukwaardes verwag word, kan die funksie parseFloat gebruik word:

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

Daar is 'n div en 'n knoppie. Met 'n druk op die knoppie, stel die div se breedte in op 400px, en sy hoogte op 300px.

Daar is 'n div:

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

Daar is ook 'n knoppie. Met 'n klik op die knoppie, voer die div se breedte en hoogte sonder meeteenhede uit.

Daar is 'n div:

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

Daar is ook 'n knoppie. Met 'n klik op die knoppie, voer die div se fontgrootte sonder meeteenhede uit.