.width()

Ширина

Получить и/или установить внутреннюю ширину элемента.

width(element [, value])

Метод .width() может быть полезен при работе с внутренней шириной элемента. Метод позволяет получать и устанавливать ширину требуемому элементу. Следующий параметр может быть передан функции:

Параметр Тип Описание
element Node Элемент HTML.
value Number Новая внутренняя ширина элемента.

Использование

Если имеются border (граница) или padding (внутренний отступ), то их размеры могут вычитаться, итоговый результат определится в зависимости от CSS свойства box-sizing.

<div id="example-blank" class="uk-width-medium">Карточка</div>

<div id="example-card" class="uk-width-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-width-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.width(myElBlank),
    myCurrentCard   = util.width(myElCard),
    myCurrentCardCB = util.width(myElCardCB);

console.log(myCurrentBlank, myCurrentCard, myCurrentCardCB)

Результат

300 220 300
// Установим новую ширину
util.width(myElBlank, 100); // style="width: 100px;"
util.width(myElCard, 100);  // style="width: 180px;"

// Получим новую ширину
let myAfterBlank = util.width(myElBlank),
    myAfterCard  = util.width(myElCard);

console.log(myAfterBlank, myAfterCard)

Результат

100 100