Javascript和jQuery获取元素的宽度、高度和位置。

Javascript和jQuery获取元素的宽度、高度和位置。
在Javascript

(ELE。getboundingclientrect):获得相对于浏览器窗口坐标的元素(不论是否父母的位置),返回一个对象,该对象有6个属性:上/左/右/下/宽度/ height.almost所有浏览器都支持这种方法。有没有直接在jQuery方法,这需要计算美元(ELE)。偏移()。顶- $(document)的ScrollTop()。

注:右边指的是右边和窗口左边的距离,底部是从边界到窗口的最高距离。

的pageyoffset属性别名的scrolly属性,设置或返回当前像素在垂直direction.window.pageyoffset = window.scrolly文件卷的价值;前者更好的浏览器兼容性。

获取页面文档中元素的位置:
var x = ele.getboundingclientrect(左+ scrollTop);

var y = ele.getboundingclientrect()。顶+ scrollTop;
滚动窗口中的位置和文档的大小

为了在浏览器上兼容,文档滚动的长度如下:

varscrolltop = document.documentelement.scrolltop window.pageyoffset document.body.scrolltop | | | |;
在jQuery

1位。鼠标相对于页面

事件。pagex / event.pagey:之间的距离相对于鼠标左/上页面的边缘。

2的位置偏移量。元素

偏移():返回包含两个属性的顶部和左边,相对于文档文档的坐标。

位置():返回一个对象,它包含两个属性,分别是顶部和左边,相对于包含元素的最近位置的位置。如果不是,它相对于文档。它只对可见元素有效,并且注意到,可见性:隐藏}也是可见元素。

宽度3。元素

宽度()()/高度():获取或设置元素{内容}的宽度/高度;如果元素的显示:无,则其值为0。

InnerWidth()()/():获得innerheight宽度/高度的元素包括内侧缘(填充),不包括边界;

边界的高度与宽度()/():获取网页的宽度/高度的元素包括内侧缘(填料)和边界(边界);

边界的高度与宽度(真正的) /网页(真):宽度/高度的整体单元,包括外缘、内缘、边界和内容;
小心 uff1a

1)ele.css(高度):返回一个字符串的一个完整的单元(如400px),如果操作需要一个conversion.ele.height parseInt():返回一个数字值没有单位(例如,400)。

2)高度()总是返回内容的宽度,无论CSS盒子大小的属性值。如果CSS盒子大小的边界框,它会导致这个功能来改变容器的网页,不仅原有内容的高度。

4。浏览器相关的宽度

$(窗口)Height():获取浏览器可视窗口的高度;

Height():整个Web文档的高度;当Web页面的高度小于浏览器窗口时,返回值是$(窗口)。Height()。

相应的文档元素的滚动条顶部的垂直偏移量是相对于元(文件)。ScrollTop():文档元素,从而获得滚动的距离或设置距离滚动。

那就是:当网页滚动拉到最下端,$(document)(的高度)= $(窗口),Height(+)(窗口)(ScrollTop)。

注意:不建议使用$()Height()、$()Height()方法来获取原因的高度:

$()Height():正文可能有一个边框,并且高度将小于$(文档)。Height();

Height():不同浏览器获得的高度不同,浏览器不兼容。

如果$(窗口). Height()返回的不是浏览器窗口的高度,则可能是Web页面不添加声明。

tag:位置元素宽度高度电脑软件

相关内容