outerWidth-metode

Die outerWidth-metode laat toe om die wydte van 'n element te verkry en te verander, met inagneming van binnewitruimtes, grense en selektief - buitepadding van die element. Dit is belangrik om te onthou dat ons die 'berekende waarde' van die wydte sal verkry (computed width). Foute in die berekening kan ook voorkom as die gebruiker die bladsygroottes verander, en ook as die element of sy ouer versteek is.

Sintaksis

So kan ons die wydte van die element verkry. Hierdie metode kan 'n opsionele parameter in die vorm van true of false aanvaar (false is standaard), afhangende van of buitepadding in ag geneem sal word of nie. In sommige gevalle kan die verkrygde waardes breukdele wees:

$(selektor).outerWidth([insluitend_margin]);

Om die wydte van die element te verander - kan 'n eenvoudige nommer oorgedra word (byvoorbeeld 400), dan sal die eenhede van meet pixels wees, of 'n string, met die eenhede van meet aangedui (byvoorbeeld '10em'):

$(selektor).outerWidth(nuwe waarde, [insluitend_margin]);

Ons kan ook 'n gegewe funksie op elke element in die stel toepas. Terwyl die funksie die eerste parameter die nommer van die element in die stel kry, en die tweede parameter - die huidige waarde van die gegewe wydte vir die spesifieke element. this binne die funksie sal wys na die huidige element. Die wydtewaarde van die element sal verander na dié wat die funksie teruggee:

$(selektor).outerWidth(function(nommer in stel, huidige wydtewaarde));

Voorbeeld

Kom ons gee ter vergelyking inligting oor die wydte van die paragraaf #test, verkry deur die metodes width, innerWidth en outerWidth:

<p id="test">teks</p>
<p id="out1"></p>
<p id="out2"></p>
<p id="out3"></p>
<p id="out4"></p>

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

let w1 = $('#test').width();
let w2 = $('#test').innerWidth();
let w3 = $('#test').outerWidth(false);
let w4 = $('#test').outerWidth(true);

$('#out1').text(w1);
$('#out2').text(w2);
$('#out3').text(w3);
$('#out4').text(w4);

Sien ook

die width-metode,
wat toelaat om die wydte van 'n element te verkry en te verander
die innerWidth-metode,
wat toelaat om die wydte van 'n element te verkry en te verander, met inagneming van sy binnewitruimtes