DOM中的位置和大小(总结)
【window】window对象
一、position位置
screenLeft/screenTop (适用于火狐和谷歌)
screenX/screenY (适用于IE)
二、size大小
innerHeight/innerWidth 显示文档的区域大小
outerHeight/outerWidth 这个窗口大小包括工具栏、滚动条
【element】元素对象
一、position位置
offsetLeft / offsetTop 边框盒的位置,一第一个定位(position:absolute)的父级元素为准
二、size大小
clientWidth/clientHeight 内容+内边距(填充盒)
offsetWidth/offsetHeight 内容+内边距+边框(边框盒)
【mouse】鼠标事件对象
clientX/clientY 相对于视口的坐标
pageX/pageY 相对于事件源的位置
offsetX/offsetY 相对于整个文档的位置
screenX/screenY 相对于屏幕的位置
DOM中的位置和大小(总结)的更多相关文章
- ios view的frame和bounds之区别(位置和大小)
前言: 学习ios开发有一段时间了,项目也做了两个了,今天看视频,突然发现view的frame和bound两个属性,发现bound怎么也想不明白,好像饶你了死胡同里,经过一番尝试和思考,终于弄明白bo ...
- Js位置与大小(1)——正确理解和运用与尺寸大小相关的DOM属性
在web开发中,不可避免遇到要计算元素大小以及位置的问题,解决这类问题的方法是利用DOM提供的一些API结合兼容性处理来,所有内容大概分3篇左右的文章的来说明.本文作为第一篇,介绍DOM提供的与尺寸大 ...
- HTML中常见的各种位置距离以及dom中的坐标讨论
最近在学习JavaScript,特意买了一本犀牛角书来看看,尼玛一千多页,看的我头昏脑涨,翻到DOM这章节,突然记起平常在使用DOM时,碰到了好多的这个dom里面的各种宽度,高度,特意在此写一写,写的 ...
- Selenium2学习-031-WebUI自动化实战实例-029-JavaScript 在 Selenium 自动化中的应用实例之四(获取元素位置和大小)
通过 JS 或 JQuery 获取到元素后,通过 offsetLeft.offsetTop.offsetWidth.offsetHeight 即可获得元素的位置和大小,非常的简单,直接上源码了,敬请参 ...
- iOS - (TableView中利用系统的 cell 设置 cell.textlabel 位置和大小)
今天工作稍微的遇到了一点小小的难题,需求效果中 TableView cell 中的 Label 字体大小比原先系统中的要大些且 Label 位置不是在前面,而是在中间往后,对于这个问题我第一时间也是想 ...
- 使用html元素的getBoundingClientRect来获取dom元素的时时位置和大小
使用: var section = $('.section'):这是jquery包装的dom元素,其他前端框架返回的可能也是一个包装元素, 我们需要获得的是里面的html的dom元素 然后:secti ...
- 04-老马jQuery教程-DOM节点操作及位置和大小
1. jQuery创建DOM标签 1.1 DOM动态创建标签的方法 DOM时代我们通过document的createElement方法动态创建标签.创建标签后,动态的给他添加属性.例如代码: // 动 ...
- iOS开发-修改UITableViewCell中image和title的位置和大小
最近在开发中遇到需要Cell中imageView和textLable位置和大小的情况,设计希望得到的结果如下图所示: 而TableViewCell默认样式,image是靠紧左边的,并且image和ti ...
- easyui datagrid 加载 历险记(dom中已经加载,fit:true 时改变浏览器大小是会显示出来)
(dom中已经加载,fit:true 时改变浏览器大小是会显示出来) 第一个想到的就是resize datagird 大小!可是没有用 ... 答案是加载的的div height为0导至的(//To ...
随机推荐
- hibernate配置文件模板
hibernate.cfg.xml 配置文件模版: <?xml version='1.0' encoding='UTF-8'?> <!DOCTYPE hibernate-config ...
- Struts2 控件标签
Struts 2 的标签有一组标签,更容易控制流程页面执行.以下是重要的Struts2控制标签列表: if /else 标签: 这些标签执行可在每一种语言找到的一种基本条件流程. 'If'标签可用于本 ...
- 本地安装配置Gradle及IDEA使用本地Gradle
一.下载Gradle 下载地址:http://services.gradle.org/distributions/ 下载版本的bin.zip 二.配置环境变量 三.验证 在cmd模式下查看 ...
- 一次面试题,将 字符串 保存在 Byte 数组中
最近在面试,遇到一个面试题 字符串 String str = "AD428C93DE" 编程实现把 str 的内容放到 Byte[6] b 的数组中,存入后并能恢复原来的字符串. ...
- 【ZooKeeper系列】3.ZooKeeper源码环境搭建
前文阅读: [ZooKeeper系列]1.ZooKeeper单机版.伪集群和集群环境搭建 [ZooKeeper系列]2.用Java实现ZooKeeper API的调用 在系列的前两篇文章中,介绍了Zo ...
- 004 ceph存储池
介绍:前面已经使用deploy和ansble部署了ceph集群,现在对集群的池进行简单介绍和简单操作 一.部分概念 池是ceph存储集群的逻辑分区,用于存储对象 对象存储到池中时,使用CRUSH规则将 ...
- 组长组Beta阶段贡献分配规则
此作业要求参见:https://edu.cnblogs.com/campus/nenu/2019fall/homework/9910“ “组长”组贡献分分配规则: 组里五位成员分别有入团队贡献分10分 ...
- JS-数组常用方法整理
想了解数组有哪些原生方法,控制台输出,如图: length:数组的实例属性,返回或设置一个数组中的元素个数. toString():可以把数组转换成字符串,并返回结果. toLocaleString( ...
- SpringBoot+Neo4j在社交电商中,讲述你是怎么被绑定为下线的
上两篇文章我们主要讲解了Neo4j的基本知识以及Neo4j的基本使用,这篇文章我们就以实例来深入的理解一下,我们以社交电商中的绑定关系为例,使用SpringBoot+Neo4j来实现. Neo4j文章 ...
- phpstudy nginx设置CORS跨域不起作用的可能解决方法
今天搞了半天的跨域问题,想通过nginx配置跨域,希望以后本地调试程序都不用为这件事烦心.无非就是设置几个请求头: add_header Access-Control-Allow-Origin *; ...