outerHeight մեթոդը

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

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

Այսպես մենք կարող ենք ստանալ տարրի բարձրությունը: Այս մեթոդը կարող է ընդունել ընտրովի պարամետր՝ true կամ false (լռելյայն կարգավիճակում false է), կախված նրանից՝ արտաքին տարածությունները կհաշվի առնվեն, թե ոչ: Որոշ դեպքերում ստացված արժեքները կարող են լինել կոտորակային:

javascript$(ընտրող).outerWidth([ներառյալ_margin]);

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

javascript$(ընտրող).outerHeight(նոր արժեք, [ներառյալ_margin]);

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

javascript$(ընտրող).outerHeight(function(համարը հավաքածուում, բարձրության ընթացիկ արժեք));

Օրինակ

Եկեք համեմատության համար արտածենք #test պարբերության բարձրության մասին տեղեկատվությունը, որը ստացվել է height, innerHeight և outerHeight մեթոդներով:

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

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

javascriptlet h1 = $('#test').height();
let h2 = $('#test').innerHeight();
let h3 = $('#test').outerHeight();
let h4 = $('#test').outerHeight(true);

$('#out1').text(h1);
$('#out2').text(h2);
$('#out3').text(h3);
$('#out4').text(h4);

Տես նաև