innerWidth методи

innerWidth методи элементнинг энини унинг ички чеккаларини хисобга олган холда олиш ва ўзгартириш имконини беради. 'Ҳисобланган қиймат' энини (computed width) оламиз, деб эслаб қолиш муҳим. Фойдаланувчи саҳифа ўлчамларини ўзгартирганда, шунингдек элемент ёки унинг ота-онаси яширин бўлганда ҳисоблашда хатолик юз белиши мумкин. Эннинг қиймати элементнинг chegarasining қалинлигини хисобга олмайди.

Синтаксис

Элементнинг энини олиш. Айрим ҳолларда олинган қийматлар касрли бўлиши мумкин:

$(селектор).innerWidth();

Элементнинг энини ўзгартириш учун - жуда сон (масалан 400) ўтказа оламиз, бунда ўлчов бирликлари пикселлар бўлади, ёки ўлчов бирликлари кўрсатилган сатрни (масалан '10em'):

$(селектор).innerWidth(янги қиймат);

Шунингдек, биз белгиланган функциани тўпламдаги ҳар бир элементга қўллашимиз мумкин. Бунда биринчи параметр сифатида функция тўпламдаги элементнинг рақамини олади, иккинчи параметр сифатида эса аник элемент учун белгиланган эннинг жорий қийматини. Функция ичидаги this қиймати жорий элементни кўрсатади. Элементнинг эннинг қиймати функция қайтарган қийматга ўзгаради:

$(селектор).innerWidth(function(тўпламдаги рақам, эннинг жорий қиймати));

Мисол

Солиштириш учун #test абзаци эни ҳақида маълумотни, width ва innerWidth методлари билан олинган, чиқарайлик:

<p id="test">матн</p>
<p id="out1"></p>
<p id="out2"></p>

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

let w1 = $('#test').width();
let w2 = $('#test').innerWidth();

$('#out1').text(w1);
$('#out2').text(w2);

Биз 10px фарқни кўрамиз, бу бизнинг чап ва ўнг ички чеккаларимизнинг йиғиндисидир.

Шунингдек қаранг

width методи,
элементнинг энини олиш ва ўзгартириш имконини беради
outerWidth методи,
элементнинг энини унинг чеккалари ва чегарасини хисобга олган холда олиш ва ўзгартириш имконини беради