DOMRect 表示的盒子的类型由返回它的方法或属性指定。例如，WebVR API 的 VREyeParameters.renderRect (en-US) 指定了头戴式显示器的一只眼睛应该呈现的影像所在的 canvas 的视口。

https://developer.mozilla.org/zh-CN/docs/Web/API/DOMRect

DOMRect对象包含了元素的大小以及相对于视口的位置，它包含了下面的属性和方法：

x：元素的左上角的水平坐标

y：元素的左上角的垂直坐标

width：元素的宽度

height：元素的高度

top：元素的上边界距离页面顶部的距离

right：元素的右边界距离页面左边的距离

bottom：元素的下边界距离页面顶部的距离

left：元素的左边界距离页面左边的距离

toString()：返回一个字符串，包含了上述信息

DOMRect对象的更多相关文章

  1. JavaScript中尺寸、坐标

    测试环境是IE8,Chrome38,Firefox40,下面是全局通用脚本打印代码 /** * 打印 */ function write(str) { document.write(str + '&l ...

  2. Javascript操作DOM常用API总结

    基本概念 在讲解操作DOM的api之前,首先我们来复习一下一些基本概念,这些概念是掌握api的关键,必须理解它们. Node类型 DOM1级定义了一个Node接口,该接口由DOM中所有节点类型实现.这 ...

  3. JavaScript常见原生DOM操作API总结

    [TOC] 最近面试的时候被这个问题给卡了,所以抽时间好好复习一下. 几种对象 Node Node是一个接口,中文叫节点,很多类型的DOM元素都是继承于它,都共享着相同的基本属性和方法.常见的Node ...

  4. JavaScript原生DOM操作API总结

    最近面试的时候被这个问题给卡了,所以抽时间好好复习一下. 原文:http://www.cnblogs.com/liuxianan/p/javascript-dom-api.html 几种对象 Node ...

  5. JavaScript 操作 DOM 常用 API 总结

    文本整理了javascript操作DOM的一些常用的api,根据其作用整理成为创建,修改,查询等多种类型的api,主要用于复习基础知识,加深对原生js的认识. 基本概念 在讲解操作DOM的api之前, ...

  6. 常用DOM API

    Node Node是一个接口,中文叫节点,很多类型的DOM元素都是继承于它,都共享着相同的基本属性和方法.常见的Node有 element,text,attribute,comment,documen ...

  7. 【全面总结】js获取元素位置大小

    [js获取元素位置+元素大小]全面总结 目录 1.关于offset offsetParent(只读) offsetTop(只读) offsetLeft(只读) offsetHeight(只读) off ...

  8. css响应式布局

    以设计稿为准,假设设计稿竖屏宽度为750px,取根元素的font-size为50px 在iphone6(375px)下,deviceWidth=7.5rem, 这个就是viewPort中的device ...

  9. vue-eleme 学习笔记

     # watch 用法 (1).普通的watch <div style="margin-top: 60px;"> {{common}} <button @clic ...

  10. Top值

    业务开发中经常会用到元素或者浏览器窗口的各种top值,最近开发组件的过程中也遇到各种问题,因此决定好好总结一下. 常见的top值 scrollTop Element.scrollTop 属性可以获取或 ...

随机推荐

  1. #差分约束，Floyd#洛谷 2474 [SCOI2008]天平

    题目 分析 非传统差分约束?? 注意只有结果保证惟一的选法才统计在内 这就为差分约束提供了依据 以左边重为例,假设现在选择的砝码为\(i,j\), 那么\(\because A+B>i+j\th ...

  2. Jenkins首次启动慢

    场景描述启动Jenkins后,打开网站,发现一直卡在这个启动页面,慢,很慢,非常慢 解决方法 进入Jenkins的安装目录,找到"hudson.model.UpdateCenter.xml& ...

  3. 堆结构（Heap）的基本实现【数据结构与算法—TypeScript 实现】

    笔记整理自 coderwhy 『TypeScript 高阶数据结构与算法』课程 概念 本质:一种特殊的树结构,由 完全二叉树 实现 多数情况为二叉堆 二叉堆:最大堆.最小堆 最大堆:堆上的每个节点都的 ...

  4. WGAN

    wgan之前, 原始GAN出现了什么问题? https://www.cnblogs.com/Allen-rg/p/10305125.html 判别器越好,生成器梯度消失越严重 一句话概括:最小化第二种 ...

  5. How to install Django-Install Python Django | Django 安装指南【官方版】

    How to install Django¶ This document will get you up and running with Django. Install Python--Linux ...

  6. C#开发的PhotoNet看图软件 - 开源研究系列文章 - 个人小作品

    这几天忙于编程.上次发布了壁纸管理器的插件版( https://www.cnblogs.com/lzhdim/p/18074135 ),然后整理和添加了一下相关的壁纸图片文件,虽然在管理器中也能浏览壁 ...

  7. Java：得到指定年份、月份、周次的最后一天

    使用Java的工具类Calendar 通过Calendar可以进行很多的日期操作 /** * 得到指定年份的最后一天 * @param year */ public static void getLa ...

  8. springboot多模块项目启动经历

    springboot多模块使用 @ 目录 springboot多模块使用 前言 大佬把项目权限给我了,我就先下下来看看学习一下 一.识别 二.maven配置 1.安装maven 三.加载刷新 总结 前 ...

  9. JavaScript如何判断一个元素是否在可视区域中？

    一.用途 可视区域即我们浏览网页的设备肉眼可见的区域,如下图 在日常开发中,我们经常需要判断目标元素是否在视窗之内或者和视窗的距离小于一个值(例如 100 px),从而实现一些常用的功能,例如: 图片 ...

  10. 还原数据库从远端环境到本地开发环境，数据SINGLE_USER问题

    要还原到本地开发环境,首先要detach本地数据库或者是删除本地数据库,不然提示在使用中还原不了,但是搞过几次去做detach和drop数据库时,总是不成功,最后还出现个单用户模式,莫名奇妙 为此网上 ...