HTML DOM Element offsetWidth 属性
- ముంది పేజీ offsetHeight
- తదుపరి పేజీ offsetLeft
- పైకి తిరిగి వెళ్ళు హెచ్టిఎంఎల్ డొమ్ ఎలమెంట్స్ ఆబ్జెక్ట్
定义和用法
offsetWidth
属性返回元素的可视宽度(以像素为单位),包括内边距、边框和滚动条,但不包括外边距。
offsetWidth
属性是只读的。
请参阅:CSS 框模型教程
offsetParent
所有块级元素都报告相对于偏移父级的偏移量:
- offsetTop
- offsetLeft
- offsetWidth
- offsetHeight
偏移父级指的是最近的具有非静态位置的祖先。
ఏదైనా సరిహద్దు లేకపోతే, సరిహద్దు డాక్యుమెంట్ ప్రధాన పాఠానికి సంబంధించినది ఉంటుంది.
మరింత విచారణ కొరకు:
ప్రతిమానం
ఉదాహరణ 1
డివిడ్ "myDIV" యొక్క పొడవు మరియు వెడల్పును పొందండి, అంతర్భాగ మరియు బోర్డర్ సహా:
const elmnt = document.getElementById("myDIV"); let టెక్స్ట్ = "ప్యాడింగ్ మరియు బోర్డర్ తో పొడవు: " + ఎల్మెంట్.offsetHeight + "px<br>"; text += "Width with padding and border: " + elmnt.offsetWidth + "px";
ఉదాహరణ 2
clientHeight/clientWidth మరియు offsetHeight/offsetWidth మధ్య వ్యత్యాసంస్క్రోల్ లేకపోయినప్పుడు:
const elmnt = document.getElementById("myDIV"); let text = ""; text += "Height with padding: " + elmnt.clientHeight + "px<br>"; text += "Height with padding and border: " + elmnt.offsetHeight + "px<br>"; text += "Width with padding: " + elmnt.clientWidth + "px<br>"; text += "Width with padding and border: " + elmnt.offsetWidth + "px";
స్క్రోల్ ఉండినప్పుడు:
const elmnt = document.getElementById("myDIV"); let text = ""; text += "Height with padding: " + elmnt.clientHeight + "px<br>"; text += "Height with padding, border and scrollbar: " + elmnt.offsetHeight + "px<br>"; text += "Width with padding: " + elmnt.clientWidth + "px<br>"; text += "Width with padding, border and scrollbar: " + elmnt.offsetWidth + "px";
సంకేతం
element.offsetWidth
తిరిగి వచ్చే విలువ
రకం | వివరణ |
---|---|
సంఖ్య | ఎలిమెంట్ యొక్క కనిపించే వెడల్పు (పిక్సెల్లలో అందించబడుతుంది), అంతర్గత ప్యాడింగ్, బార్డర్ మరియు స్క్రోల్ బార్. |
బ్రౌజర్ మద్దతు
అన్ని బ్రౌజర్లు ఈ విషయాన్ని మద్దతు ఇస్తాయి element.offsetWidth
:
Chrome | IE | Edge | Firefox | Safari | Opera |
---|---|---|---|---|---|
Chrome | IE | Edge | Firefox | Safari | Opera |
మద్దతు | మద్దతు | మద్దతు | మద్దతు | మద్దతు | మద్దతు |
- ముంది పేజీ offsetHeight
- తదుపరి పేజీ offsetLeft
- పైకి తిరిగి వెళ్ళు హెచ్టిఎంఎల్ డొమ్ ఎలమెంట్స్ ఆబ్జెక్ట్