.height()
Получить и/или установить внутреннюю высоту элемента.
height(element [, value])
Метод .height()
может быть полезен при работе с внутренней высотой элемента.
Метод позволяет получать и устанавливать высоту требуемому элементу.
Следующий параметр может быть передан функции:
Параметр | Тип | Описание |
---|---|---|
element |
Node | Элемент HTML. |
value |
Number | Новая внутренняя высота элемента. |
Использование
Если имеются border
(граница) или padding
(внутренний отступ), то их размеры могут вычитаться,
итоговый результат определится в зависимости от CSS свойства box-sizing
.
<div id="example-blank" class="uk-height-medium">Карточка</div>
<div id="example-card" class="uk-height-medium uk-card uk-card-default uk-card-body">Карточка</div>
<style>
#example-card-content-box {
box-sizing: content-box;
}
</style>
<div id="example-card-content-box" class="uk-height-medium uk-card uk-card-body">Карточка</div>
const myElBlank = util.$('#example-blank'),
myElCard = util.$('#example-card'),
myElCardCB = util.$('#example-card-content-box');
// Получим текущую высоту
let myCurrentBlank = util.height(myElBlank),
myCurrentCard = util.height(myElCard),
myCurrentCardCB = util.height(myElCardCB);
console.log(myCurrentBlank, myCurrentCard, myCurrentCardCB)
Результат
300 220 300
// Установим новую высоту
util.height(myElBlank, 100); // style="height: 100px;"
util.height(myElCard, 100); // style="height: 180px;"
// Получим новую высоту
let myAfterBlank = util.height(myElBlank),
myAfterCard = util.height(myElCard);
console.log(myAfterBlank, myAfterCard)
Результат
100 100