//滚动条

 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. 在A卡下的 Matlab 运行C/C++混编的GPU程序

    首先将你的.MEX文件和matlab脚本放在一个文件夹下开始运行 如果出错查看是那个.MEX文件出错 用depends这个软件查看他的依赖dll文件下载对应文件 放到当前文件夹下,运行成功.

  2. CDH安装详细测试正确

    1. CDH简介 简单来说,Cloudera Manager是一个拥有集群自动化安装.中心化管理.集群监控.报警功能的一个工具(软件),使得安装集群从几天的时间缩短在几个小时内,运维人员从数十人降低到 ...

  3. LeetCode 第26题--数组中重复元素

    1. 题目 2.题目分析与思路 3.代码 1. 题目 给定数组 nums = [1,1,2], 函数应该返回新的长度 2, 并且原数组 nums 的前两个元素被修改为 1, 2. 你不需要考虑数组中超 ...

  4. JS 头像显示

    HTML <div class="form-group"> <label class="col-sm-3 control-label"> ...

  5. FindBugs报错

    FindBugs是基于Bug Patterns概念,查找javabytecode(.class文件)中的潜在bug,主要检查bytecode中的bug patterns,如NullPoint空指针检查 ...

  6. [bzoj3527] [洛谷P3338] [Zjoi2014]力

    Description 给出n个数qi,给出Fj的定义如下: \[ F_j=\sum\limits_{i<j} \frac{q_iq_j}{(i-j)^2} - \sum\limits_{i&g ...

  7. （转）GET来的漏洞

    转自呆子不开口在wooyun知识库的文章 0x00 前言 这篇文章主要讲目前互联网上get方法被不规范使用带来的一些安全漏洞.其中重点会讲get请求在账号登陆体系中被滥用的场景和攻击方式. 0x01 ...

  8. 机器学习-MNIST数据集使用二分类

    一.二分类训练MNIST数据集练习 %matplotlib inlineimport matplotlibimport numpy as npimport matplotlib.pyplot as p ...

  9. NOI2.6 8782: 乘积最大

    描述 今年是国际数学联盟确定的"2000--世界数学年",又恰逢我国著名数学家华罗庚先生诞辰90周年.在华罗庚先生的家乡江苏金坛,组织了一场别开生面的数学智力竞赛的活动,你的一个好 ...

  10. 龙芯 3B1500 Fedora28 安装笔记

    版权声明:原创文章,未经博主允许不得转载 龙芯 3A4000 已经发布,十年前的 3B1500 早就落伍了.但我还是打算把它作为寒假刷 ACM 题的主力机 并将此当作年后收到 4000 的预习. 龙芯 ...