美文网首页
JS常用宽高位置属性

JS常用宽高位置属性

作者: JasonQiao | 来源:发表于2016-04-14 16:42 被阅读42次

网页可见区域宽: document.body.clientWidth;
网页可见区域高: document.body.clientHeight;
网页可见区域宽: document.body.offsetWidth (包括边线的宽);
网页可见区域高: document.body.offsetHeight (包括边线的宽);
网页正文全文宽: document.body.scrollWidth;
网页正文全文高: document.body.scrollHeight;
网页被卷去的高: document.body.scrollTop;
网页被卷去的左: document.body.scrollLeft;
网页正文部分上: window.screenTop;
网页正文部分左: window.screenLeft;
屏幕分辨率的高: window.screen.height;
屏幕分辨率的宽: window.screen.width;
屏幕可用工作区高度: window.screen.availHeight;
屏幕可用工作区宽度:window.screen.availWidth;

scrollHeight: 获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:获取对象的滚动宽度
offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
event.clientX 相对文档的水平座标
event.clientY 相对文档的垂直座标

event.offsetX 相对容器的水平坐标
event.offsetY 相对容器的垂直坐标
document.documentElement.scrollTop 垂直方向滚动的值
event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量
要获取当前页面的滚动条纵坐标位置,用:
document.documentElement.scrollTop;
而不是:
document.body.scrollTop;
documentElement 对应的是 html 标签,而 body 对应的是 body 标签

相关文章

  • JS常用宽高位置属性

    网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body...

  • js中的各种宽高以及位置总结

    前言 被原生js的各种宽高、位置搞到爆炸,所以做一个小小的总结!!! dom对象 只读属性 clientWidth...

  • offset scroll client

    在JS中有三种常用来获取元素宽高和位置的方法,称之为JS的三大系列 一. offset系列 计算方式: (父级元素...

  • UIView的autoresizingMask属性的研究

    UIView中有个属性是autoresizingMask,属性的意思就是自动调整子控件与父控件中间的位置,宽高。 ...

  • JS获取的常用宽高

    window.screen.width 频率分辨率宽window.screen.height ...

  • Flutter Widget之Align

    Align组件允许我们通过修改它的属性来调整子组件的位置,并且可以根据子组件的宽高来确定Align自身的的宽高。首...

  • JS获取屏幕宽高属性总结

    平时在写界面获取屏幕、浏览器宽高时,经常会搞不清楚window、body、screen中的clientWidth、...

  • JavaScript基础

    1.书写位置 -内嵌式写法 -外联式写法新建js文件 test.js //可以引用多个-行内,不常用 2.属性 a...

  • js中的各种宽高理解

    在js之中有很多方法,属性是与宽高相关的,但是具体的区别又不太清楚。现就这些表示宽高的方法属性做一总结。假设我们有...

  • 重绘和回流(重排)是什么,如何避免?

    DOM的变化影响到了元素的几何属性(宽高),浏览器重新计算元素的几何属性,其他元素的几何 属性和位置也会受到影响,...

网友评论

      本文标题:JS常用宽高位置属性

      本文链接:https://www.haomeiwen.com/subject/djiglttx.html