HTML DOM offsetWidth 属性

مثلث HTML DOM للعنصر

offsetWidth只读属性以整数形式返回元素的宽度，包括水平填充和边框。

通常，offsetWidth元素CSS宽度的像素度量，包括任何边框、填充和垂直滚动条(如果有的话)。它不包括伪元素的宽度，例如:: before或:: after。

要了解此属性，您必须了解CSS Box Model。

使用clientHeight和clientWidth属性返回元素的可见高度和宽度，包括填充，但不包括边框，边距和滚动条（如果存在）。

语法：

element.offsetWidth

var elem = document.querySelector("div");
var　txt　=　"Height　including　padding　and　border:　"　+　elem.offsetHeight　+　"px
";
txt　+=　"Width　including　padding　and　border:　"　+　elem.offsetWidth　+　"px";

مرونة المتصفح

يدعم جميع المتصفحات خصائص offsetWidth بشكل كامل:

تفاصيل التقنية

مزيد من الأمثلة

هذا المثال يوضح الفرق بين clientWidth وoffsetWidth:

var elem = document.querySelector("div");
var txt = "Width يحتوي على padding: " + elem.clientWidth + "px<br>";
txt += "Width يحتوي على padding + border: " + elem.offsetWidth + "px";

مراجع ذات صلة

مرجع HTML DOMخصائص offsetHeight

مرجع HTML DOMخصائص offsetLeft

مرجع HTML DOMخصائص offsetTop

مرجع HTML DOMخصائص offsetParent

مثلث HTML DOM للعنصر