//滚动条

 scrollLeft//滚动条距左边距离

 scrollTop//滚动条距顶部距离

 scrollWidth//滚动条元素的宽

 scrollHeight//滚动条元素的高

 //可视范围

 clientHeight//元素自身可视区域高

 clientTop

 //this.clientW = document.documentElement.clientWidth;//可视宽

 //this.clientH = document.documentElement.clientHeight;//可视高

 //鼠标

 event.offsetY  获取鼠标的高

 event.clientY  获取鼠标可视区域高

 //dom

 offsetTop//元素距顶部的距离

 offsetHeight//元素自身高

 window.getComputedStyle(elem).width(常用这个获取doc宽高兼容性高)

javascript js获取html元素各种距离方法的更多相关文章

  1. [JavaScript] js获取Html元素的实际宽度高度

    第一种情况就是宽高都写在样式表里,就比如#div1{width:120px;}.这中情况通 过#div1.style.width拿不到宽度,而通过#div1.offsetWidth才可以获取到宽度. ...

  2. js | javascript中获取dom元素的高度和宽度

    javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...

  3. js获取隐藏元素宽高的方法

    网上有一些js获取隐藏元素宽高的方法,但是可能会存在某些情况获取不了. 例如: <!DOCTYPE html> <html lang="en"> <h ...

  4. JS1 js获取dom元素方法

     js获取dom元素方法  1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId")         其 ...

  5. JS获取DOM元素的八种方法

    JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...

  6. javascript中获取dom元素的高度和宽度

    javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...

  7. javascript中获取dom元素高度和宽度

    javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...

  8. JavaScript js无间断滚动效果 scrollLeft方法 使用模板

    JavaScript js无间断滚动效果 scrollLeft方法 使用模板 <!DOCTYPE HTML><html><head><meta charset ...

  9. JavaScript设置获取和设置属性的方法

    这篇文章主要介绍了JavaScript设置获取和设置属性的方法,学会使用getAttribute.setAttribute的用法,需要的朋友可以参考下   getAttribute 该方法用来获取元素 ...

随机推荐

  1. 从零开始入门 K8s | GPU 管理和 Device Plugin 工作机制

    作者 | 车漾  阿里巴巴高级技术专家 本文整理自<CNCF x Alibaba 云原生技术公开课>第 20 讲. 关注"阿里巴巴云原生"公众号,回复关键词" ...

  2. docker 批量删除 镜像 容器

    我们在docker构建和测试时,经常会产生很多无用的镜像或者容器,我们可用如下两条命令一个一个删除. docker container rm 容器id #删除容器 可简写: docker rm 容器i ...

  3. LoopBox 用于包装循环的盒子

    /******************************************************* * * 作者:朱皖苏 * 创建日期:20180608 * 说明:此文件只包含一个类,具 ...

  4. python中方法调用和函数调用的区别

    函数调用: 传几个参数,就会有几个实参方法调用: 默认传递一个参数self,至少要定义一个形参

  5. 1、纯python编写学生信息管理系统

    1.效果图 2.python code: class studentSys(object): ''' _init_(self) 被称为类的构造函数或初始化方法, self 代表类的实例,self 在定 ...

  6. .Net Core2.*学习手册

    1.net core 基础知识解析(创建一个.net core网站)(视频录制) 1.1 Startup解析(没写) 1.2 目录结构分析(没写) 1.3 使用静态文件(没写) 1.4 Control ...

  7. tensorflow框架

    一.tensorflow的工作流程,实际上它体现出来的是一个”懒性“方法论 (1)构建一个计算图. (2)初始化变量 (3)创建一个会话 (4)在会话中运行图的计算 (5)关闭会话 二.神经网络搭建八 ...

  8. RChain的一键形式化验证：关于RCast 33 – LADL话题的讨论摘要

    作者/Atticbee 在这一集,Greg和RChain的研究人员Isaac,Christian讨论了TLA(Temporal Logic of Actions)和RChain的LADL(Logic ...

  9. 使用Python写的WingPro7 Pyside2 和 PyQt5插件

    pyside2的 import wingapi import subprocess pyside2_uic = "pyside2-uic" pyside2_qrc = " ...

  10. Hyper-V虚拟机Redhat添加网卡找不到网卡配置文件解决方法

    环境:Hyper-V虚拟机上面安安装Redhat6.7 问题:系统安装时,只有一块网卡,现根据需要,增加一块网卡,DHCP获取IP地址,在Hyper-V设置中增加网卡后,存在连个问题:1./etc/s ...