document.body body
document.documentelement html
寬高:
元素有多高,就會撐開多少(內容高度) ,寬度是可視寬度
document.body.clientwidth,document.body.clientheight
獲取頁面的可視寬高 ,並不會因為內容變大而撐開
document.documentelement.clientwidth,document.documentelement.clientheight
body的offsetwidth和clientwidth相同
document.body.offsetwidth,document.body.offsetheight
頁面的可視寬度,高度是8 ,有內容,寬度仍然是可視寬度,html的高度是body內容高度+bodymargin
document.documentelement.offsetwidth,document.documentelement.offsetheight
沒有內容時和body的clientwidth相同,有內容,內容撐開的寬高,和clientheight相同,內容寬度
document.body.scrollwidth,document.body.scrollheight
如果body沒有高度,則是可視寬高
如果body有寬高,不超過可視寬高,則是可視寬高
如果body的寬高超出可視範圍,則是body寬高+margin
document.documentelement.scrollwidth,document.documentelement.scrollheight
常用:
內容高度
console.
log(document.body.clientheight)
;
可視寬高console.log(document.documentelement.clientwidth,document.documentelement.clientheight)
有滾動條時,內容寬高console.log(document.body.scrollwidth,document.body.scrollheight);
位置:div1的邊線(border)寬高
div1.clientleft,div1.clienttop
沒有定位時,相對頁面的左上頂角位置
如果定位 相對父容器左上角位置 和css中left,top相同
div1.offsetleft,div1.offsettop
元素上的滾動條位置
div1.scrollleft,div1.scrolltop
getboundingclientrect()
獲取元素的矩形界限範圍
var rect=div1.
getboundingclientrect()
; console.
log(rect)
;
width, //offsetwidth
height, //offsetheight
left, //最左邊到可視視窗的距離
top, //最頂部到可視視窗的距離
right,//left+width 最右邊到可視視窗的距離
bottom,//top+height 最下面到可視視窗的距離
x, //left
y //top
window視窗的滾動條位置獲取和設定
document.documentelement.scrollleft,document.documentelement.scrolltop
談談jQuery和js裡有關位置和寬高的方法
總結一下jquery 原生js設定和獲取位置 寬高的方法。position 方法 只能獲取,不能設定。可獲取元素相對於其第乙個position值不為static的祖先元素的偏移量,如果沒有,則是相對於文件的偏移量 返回乙個物件,包括兩個屬性 left,top 屬性值無單位,number型別。具體用法...
獲取元素的寬 高和位置
原生js中 ele.getboundingclientrect 獲取乙個元素相對於瀏覽器視口的的座標 無論父元素定位與否 返回乙個object物件,該物件有6個屬性 top left right bottom width height。幾乎所有瀏覽器都支援該方法。jquery中沒有直接的方法,需要用...
Android 獲取控制項的寬高和位置
獲取控制項的絕對位置 包括狀態列 可以用這種方法,呼叫方法後,location 0 和location 1 就分別被賦值了。int location new int 2 view.getlocationonscreen location 獲取控制項的相對與當前視窗的位置可以用getlocationi...