element.offsetLeft/Top  获取元素相对于最近的有定位的父元素的坐标，如果没有有定位的父元素，则是文档坐标

element.scrollTop/Left 获取元素滚动卷去的距离

element.offsetWidth/Height 获取元素的宽度高度（包含边框）

element.clientWidth/Height 获取元素的宽度高度（不包含边框）

element.scrollWidth/Height 获取元素的内容宽度高度（包括被卷曲的部分）

e.pageX/Y 获取鼠标的文档坐标（相对于文档而言）

e.clientX/Y 获取鼠标的视口坐标（相对于视口而言）

e.screenX/Y 获取鼠标的屏幕坐标（相对于整个浏览器而言）

window.pageY/XOfffset 获取页面的滚动距离

论DOM中文档和元素的位置大小属性及其区别的更多相关文章

  1. 在解析XML时要注意解析元素和解析标签属性的区别

    解析元素时: Sting str = ele.elementText("name"); 而解析标签属性时: String key = ele.attributeValue(&quo ...

  2. 怎样理解window对象的几组位置大小属性

    第一组: window.screenX 和 window.screenY, 只读, 返回浏览器窗口左上角与屏幕左上角的水平距离和垂直距离(单位像素); 第二组: window.innerHeight ...

  3. Javascript 强制浏览器渲染Dom文档

    在Cordova+Framework7开发Hybrid App时,在iPhone 7上遇到一个诡异的现象(Chrome浏览器.Android都正常):js修改手风琴中的input文本框的值后,但页面仍 ...

  4. DOM元素的位置、尺寸及更多的信息

    一.基本概念 document.documentElement是整个DOM树的根节点,对应的元素就是html.下面将其称作根元素或根节点. document.body,对应的元素是body 二.浏览器 ...

  5. vue 组件传递值以及获取DOM元素的位置信息

    1.父组件 select_li.vue 1.1 父组件模板 <template> <div id='selectLi' ref="selectLi"> &l ...

  6. dom 页面位置和大小，元素的位置和大小，鼠标位置

    dom里面三种跟位置相关的元素 页面位置和大小,元素的位置和大小,鼠标位置 ①window:位置(position):(screenLeft, screenTop) [(screenX, screen ...

  7. 认识DOM 文档对象模型DOM（Document Object Model）定义访问和处理HTML文档的标准方法。元素、属性和文本的树结构（节点树）。

    认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面代码 ...

  8. 二、JavaScript语言--JS基础--JavaScript进阶篇--DOM对象 控制HTML元素

    1.认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面 ...

  9. JavaScript : DOM文档解析详解

    JavaScript DOM  文档解析 1.节点(node):来源于网络理论,代表网络中的一个连接点.网络是由节点构成的集合 <p title=“a gentle reminder”> ...

随机推荐

  1. pytest以函数形式形成测试用例

    #coding=utf- from __future__ import print_function #开始执行该文件时,该函数执行 def setup_module(module): print(' ...

  2. 使用electron开发桌面级小程序自动部署系统

    那一天我二十一岁,在我一生的黄金时代,我有好多奢望.我想爱,想吃,还想在一瞬间变成天上半明半暗的云,后来我才知道,生活就是个缓慢受锤的过程,人一天天老下去,奢望也一天天消逝,最后变得像挨了锤的牛一样. ...

  3. Node.js之判断字符串中是否包含某个字符串

    server.txt内容如下: 阿里云服务器 关于应用场景,就不多说了,字符串是不论是后端开发还是前端开发等,都是要经常打交道了. test.js(node.js代码,只要被本地装了node.js环境 ...

  4. quartz 1.6.2之前的版本，定时任务自动停掉问题

    https://searchcode.com/codesearch/view/28831622/ Quartz 1.6.2 Release Notes This release contains a ...

  5. epool与select有什么区别

    select在一个进程中打开的最大fd是有限制的,由FD_SETSIZE设置,默认值是2048.不过 epoll则没有这个限制,它所支持的fd上限是最大可以打开文件的数目,这个数字一般远大于2048, ...

  6. RockBrain USB Server外设虚拟化高可用解决方案（银企直联虚拟化解决方案）

    技术指标: 单.双千兆网络界面(支持链路冗余与链路热备.支持双网口均衡负载) 原生USB2.0接口(USB2.0与USB3.0接口均对所有USB版本设备兼容,支持混插) 技术优势: RockBrain ...

  7. python开发笔记-python调用webservice接口

    环境描述: 操作系统版本: root@9deba54adab7:/# uname -a Linux 9deba54adab7 --generic #-Ubuntu SMP Thu Dec :: UTC ...

  8. 案例：执行 JavaScript 语句

    隐藏百度图片 # coding=utf-8 from selenium import webdriver driver = webdriver.PhantomJS(executable_path=r' ...

  9. MongoDB开发深入之一：文档数据关系模型详解（一对多，多对多）

    文档关联模型通常有3种方式: 嵌入式(一对一.一对多) 后期手动统一ID处理(一对多.多对多) References引用(一对一.一对多) 文档树模型通常有3种方式: 父引用(Parent Refer ...

  10. VSCode调试data层时自身的一个bug

    使用VSCode在pytorch下进行调试有的时候会遇到下面这个错误: E00037.: Exception escaped from start_client Traceback (most rec ...