Metoda innerHeight

Metoda innerHeight umožňuje získat a změnit výšku elementu včetně jeho vnitřních odsazení. Je důležité pamatovat, že budeme získávat 'vypočítanou hodnotu' výšky (computed height). Chyby ve výpočtu mohou také nastat, pokud uživatel mění velikost stránky, a také, pokud je element nebo jeho rodič skrytý. Hodnota výšky nezohledňuje tloušťku okraje elementu.

Syntaxe

Získat výšku elementu. V některých případech mohou být získané hodnoty zlomkové:

$(selektor).innerHeight();

Pro změnu výšky elementu - lze předat prostě číslo (například 400), pak jednotky měření budou pixely, nebo řetězec, s uvedením jednotek měření (například '10em'):

$(selektor).innerHeight(nová hodnota);

Také můžeme aplikovat zadanou funkci na každý element v sadě. Přitom první parametr funkce obdrží číslo elementu v sadě, a druhý parametr - aktuální hodnotu zadané výšky pro konkrétní element. this uvnitř funkce bude ukazovat na aktuální element. Hodnota výšky elementu se změní na tu, kterou funkce vrátí:

$(selektor).innerHeight(function(číslo v sadě, aktuální hodnota výšky));

Příklad

Pojďme pro srovnání vypsat informace o výšce odstavce #test, získané metodami height a innerHeight:

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

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

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

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

Uvidíme rozdíl 10px, což je součet našich horního a dolního vnitřního odsazení.

Viz také

metoda height,
která umožňuje získat a změnit výšku elementu
metoda outerHeight,
která umožňuje získat a změnit výšku elementu, zohledňující jeho odsazení a okraj