innerHeight metódus

Az innerHeight metódus lehetővé teszi egy elem magasságának lekérését és módosítását, figyelembe véve a belső margókat. Fontos megjegyezni, hogy az 'elemzett értéket' kapjuk meg (computed height). Számítási hibák akkor is előfordulhatnak, ha a felhasználó megváltoztatja az oldal méretét, vagy ha az elem vagy annak szülője rejtett. A magasság értéke nem veszi figyelembe az elem szegélyének vastagságát.

Szintaxis

Elem magasságának lekérése. Egyes esetekben a kapott érték tört szám lehet:

javascript$(selector).innerHeight();

Az elem magasságának módosításához egyszerűen átadhatunk egy számot (például 400), ekkor a mértékegység pixel lesz, vagy egy karakterláncot, amely megadja a mértékegységet (például '10em'):

javascript$(selector).innerHeight(új érték);

Egy adott függvényt alkalmazhatunk minden egyes elemre a halmazban. Ebben az esetben a függvény első paramétere az elem sorszámát kapja a halmazban, a második paraméter pedig az adott elem aktuális magasságértéke. A this a függvényen belül az aktuális elemre mutat. Az elem magassága azon értékre változik, amit a függvény visszaad:

javascript$(selector).innerHeight(function(sorszám a halmazban, aktuális magasságérték));

Példa

Hasonlításként írassuk ki a #test bekezdés magasságáról szóló információt, amelyet a height és az innerHeight metódusokkal kaptunk:

html<p id="test">szöveg</p>
<p id="out1"></p>
<p id="out2"></p>

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

javascriptlet h1 = $('#test').height();
let h2 = $('#test').innerHeight();

$('#out1').text(h1);
$('#out2').text(h2);

10px különbséget fogunk látni, ami a felső és alsó belső margónk összege.

Lásd még