Metoden innerWidth

Metoden innerWidth lar oss hente og endre bredden til et element med hensyn til dens indre avstand. Det er viktig å huske at vi vil få en 'beregnet verdi' for bredden (computed width). Feil i beregningen kan også oppstå hvis brukeren endrer størrelsen på siden, eller hvis elementet eller dets forelder er skjult. Breddeverdien tar ikke hensyn til elementets kantlinjetykkelse.

Syntaks

Hente bredden til et element. I noen tilfeller kan de oppnådde verdiene være brøkdeler:

$(selector).innerWidth();

For å endre bredden på et element - kan du sende et enkelt tall (for eksempel 400), da vil måleenhetene være piksler, eller en streng, med angivelse av måleenheter (for eksempel '10em'):

$(selector).innerWidth(ny verdi);

Vi kan også bruke en gitt funksjon på hvert element i settet. I dette tilfellet vil funksjonen motta indeksen til elementet i settet som første parameter, og den nåværende verdien for den angitte bredden for det spesifikke elementet som andre parameter. Verdien this inne i funksjonen vil peke på det gjeldende elementet. Breddeverdien til elementet vil endres til den som returneres av funksjonen:

$(selector).innerWidth(function(indeks i settet, nåværende breddeverdi));

Eksempel

La oss for sammenligning skrive ut informasjon om bredden på avsnittet #test, hentet med metodene width og innerWidth:

<p id="test">text</p>
<p id="out1"></p>
<p id="out2"></p>

p {
	margin: 10px;
	padding: 5px;
	border: 2px solid blue;
}

let w1 = $('#test').width();
let w2 = $('#test').innerWidth();

$('#out1').text(w1);
$('#out2').text(w2);

Vi vil se en forskjell på 10px, som er summen av vår venstre og høyre indre avstand.

Se også

metoden width,
som lar oss hente og endre bredden til et element
metoden outerWidth,
som lar oss hente og endre bredden til et element, med hensyn til dens avstand og kantlinje