طريقة jQuery outerHeight()

طرق HTML/CSS jQuery

يستخدم طريقة outsideHeight() للحصول أو تعيين الارتفاع الخارجي للعنصر المحدد (بما في ذلك التوسع والحواف).

outsideHeight(true)للحصول أو تعيين الارتفاع الخارجي للعنصر المحدد (بما في ذلك التوسع والحواف والراحة).

عند استخدام طريقة externalHeight()الحصول علىعند ضبط الارتفاع، سيقوم بتحويلالعنصر المحدد الأولالارتفاع.

عند استخدام طريقة externalHeight()ضبطعند ضبط الارتفاع، سيقوم بضبطجميع العناصر المحددةالارتفاع.

كما هو موضح في الشكل التالي، يشمل طريقة externalHeight() الت扩يف والحواف:

لإضافة الحواف، استخدم outerHeight(true).

القواعد:

الحصول على الارتفاع الخارجي:

$(selector).outerHeight()

الحصول على الارتفاع الخارجي بما في ذلك الحواف:

$(selector).outerHeight(true)

ضبط الارتفاع الخارجي:

$(selector).outerHeight(value)

مثال

الحصول على الارتفاع الخارجي للعنصر div:

$("div").click(function(){
　　$(this).outerHeight();
});

الحصول على الارتفاع الخارجي للعنصر div (بما في ذلك الحواف):

$("div").click(function(){
　　$(this).outerHeight(true);
});

ضبط الارتفاع الخارجي لجميع الفقرات:

$("button").click(function(){
　　$("p").outerHeight(100);
});

استخدام وحدات مختلفة لضبط الارتفاع الخارجي لجميع الفقرات:

$("#btn1").click(function(){
　　$("p").outerHeight(100);
});
$("#btn2").click(function(){
　　$("p").outerHeight("7em");
});
$("#btn3").click(function(){
　　$("p").outerHeight("100vh");
});

إظهار الفرق بين width()،height()،innerHeight()،innerWidth()،outerWidth() وouterHeight():

$("button").click(function(){
　　$("div").width();
　　$("div").innerWidth();
　　$("div").outerWidth();
　　$("div").height();
　　$("div").innerHeight();
　　$("div").outerHeight();
});

قيمة المعامل

طرق HTML/CSS jQuery