outerWidth en outerHeight Metodes in jQuery

Die laaste paar metodes - outerWidth en outerHeight, waarmee dit moontlik is om die wydte en hoogte van 'n element te verkry met inagneming van alle spasies en grense, of sonder om die buitespasies margin in ag te neem.

Kom ons kyk na 'n voorbeeld. Gestel ons het 'n paragraaf:

<p id="test">teks</p>
<p id="out"></p>

CSS lyk so:

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

Kom ons verkry die wydte- en hoogtewaardes van die paragraaf #test, met inagneming van binnewyses en grense, hiervoor moet ons false aan hierdie metodes oordra of die hakies leeg laat (aangesien dit reeds by verstek in die metode gestel is):

let w = $('#test').outerWidth(false);
let h = $('#test').outerHeight();
$('#out').text('Wydte: ' + w + ' Hoogte: ' + h);

Nou sal ons waardes met nog 4px verskil, aangesien die grensdykte aan elke kant 2px is.

En nou, laat ons die wydte- en hoogtewaardes van die paragraaf verkry #test, met inagneming van alle spasies en grense, hiervoor moet ons true oordra aan die metodes outerWidth en outerHeight:

let w = $('#test').outerWidth(true);
let h = $('#test').outerHeight(true);
$('#out').text('Wydte: ' + w + ' Hoogte: ' + h);

Nou sal ons waardes van die voriges verskil met nog 20px, aangesien ons buitespasies 10px aan elke kant is.

Vul die oplossing van die vorige take aan - druk uit in die derde paragraaf onder die div #wrapper die wydte- en hoogtewaardes van die div #wrapper - met inagneming van binnewyses en grense, maar sonder buitespasies. In die vierde paragraaf, druk die wydte- en hoogtewaardes van die div #wrapper uit met inagneming van alle spasies en grense.

Ook met die metodes outerWidth en outerHeight kan ons die wydte- en hoogtewaardes van elemente verander. Byvoorbeeld, laat ons die wydte van div #test1 stel gelyk aan 250px, en die hoogte van #test2 - 200px:

$('#test1').outerWidth(250, true);
$('#test2').outerHeight(200);

Al die bogenoemde metodes om met die afmetings te werk van 'n element bied ook die moontlikheid om 'n funksie op elke element in die stel toe te pas.