innerWidth մեթոդը

innerWidth մեթոդը հնարավորություն է տալիս ստանալ և փոխել տարրի լայնությունը՝ հաշվի առնելով դրա ներքին բացերը: Կարևոր է հիշել, որ մենք կստանանք լայնության 'հաշվարկված արժեք' (computed width): Հաշվարկման սխալներ կարող են առաջանալ նաև, եթե օգտագործողը փոխում է էջի չափերը, ինչպես նաև, եթե տարրը կամ դրա ծնող թաքնված է: Լայնության արժեքը հաշվի չի առնում տարրի եզրագծի հաստությունը:

Շարահյուսություն

Ստանալ տարրի լայնությունը: Որոշ դեպքերում ստացված արժեքները կարող են լինել կոտորակային:

javascript$(ընտրիչ).innerWidth();

Տարրի լայնությունը փոխելու համար կարելի է փոխանցել պարզապես թիվ (օրինակ 400), ապա չափման միավորները կլինեն պիքսելներ, կամ տող, նշելով չափման միավորները (օրինակ '10em'):

javascript$(ընտրիչ).innerWidth(նոր արժեք);

Մենք կարող ենք նաև կիրառել տրված ֆունկցիան յուրաքանչյուր տարրի հանդեպ հավաքածուում: Այդ դեպքում ֆունկցիան առաջին պարամետրով կստանա տարրի համարը հավաքածուում, իսկ երկրորդ պարամետրով - ընթացիկ արժեքը տրված լայնության համար կոնկրետ տարրի հանդեպ: this արժեքը ֆունկցիայի ներսում կլինի ուղղված ընթացիկ տարրին: Տարրի լայնության արժեքը կփոխվի դրանով, որը կվերադարձնի ֆունկցիան:

javascript$(ընտրիչ).innerWidth(function(համարը հավաքածուում, ընթացիկ լայնության արժեք));

Օրինակ

Եկեք համեմատության համար արտածենք տեղեկատվություն #test պարբերության լայնության մասին, ստացված width և innerWidth մեթոդներով:

html<p id="test">տեքստ</p>
<p id="out1"></p>
<p id="out2"></p>

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

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

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

Մենք կտեսնենք 10px տարբերություն, որը մեր ձախ և աջ ներքին բացերի գումարն է:

Տես նաև