Метад innerHeight
Метад innerHeight дазваляе атрымліваць
і змяняць вышыню элемента з улікам яго ўнутраных
адступаў. Важна памятаць, што мы будзем атрымліваць
'вылічанае значэнне' вышыні
(computed height).
Памылкі ў вылічэнні могуць таксама ўзнікаць, калі
карыстальнік мяняе памеры старонкі, а таксама, калі
элемент ці яго бацькоўскі элемент схаваны. Значэнне вышыні не
ўлічвае таўшчыню мяжы элемента.
Сінтаксіс
Атрымаць вышыню элемента. У некаторых выпадках атрыманыя значэнні могуць быць дробнымі:
$(селектар).innerHeight();
Каб змяніць вышыню элемента - можна перадаць проста
лік (напрыклад 400), тады адзінкі
вымярэння будуць пікселі, альбо радок,
з указаннем адзінак вымярэння (напрыклад
'10em'):
$(селектар).innerHeight(новае значэнне);
Таксама мы можам ужыць зададзеную функцыю да кожнага
элемента ў наборы. Пры гэтым першым параметрам функцыя
атрымае нумар элемента ў наборы, а другім параметрам
- бягучае значэнне зададзенай вышыні для канкрэтнага
элемента. this ўнутры функцыі будзе
паказваць на бягучы элемент.
Значэнне вышыні элемента зменіцца на тое,
якое верне функцыя:
$(селектар).innerHeight(function(нумар у наборы, бягучае значэнне вышыні));
Прыклад
Давайце для параўнання выведзем інфармацыю пра
вышыню абзаца #test, атрыманую метадамі
height
і 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);
Мы ўбачым розніцу ў 10px, што з'яўляецца сумай
нашых верхняга і ніжняга ўнутраных адступаў.
Глядзіце таксама
-
метад
height,
які дазваляе атрымліваць і змяняць вышыню элемента -
метад
outerHeight,
які дазваляе атрымліваць і змяняць вышыню элемента, улічваючы яго адступы і мяжу