加给元素:
offsetLeft(距离定位父级的距离)/offsetTop(距离定位父级的距离)/offsetWidth(可视宽度)/offHeight(可视高度)
clientLeft(左边框宽度)/clientTop(上边框宽度)/clientWidth(width+padding)/clientHeight(height+padding)
getBoundingClientRect() 返回值对象
left (元素左侧相对于可视区左上角的距离)
right(元素右侧相对于可视区左上角的距离)
top (元素上边相对于可视区左上角的距离)
bottom (元素底部相对于可视区左上角的距离)
width (可视宽度)
height (可视高度)
scollTop(纵向滚动距离)/scollLeft(横向滚动距离)/scollWidth(内容宽度)/scollHeight(内容高度)
 
获取可视区宽高:
window.innerWidth/window.innerHeight
document.documentElement.clientWidth/document.documentElement.clientHeight
 
屏幕宽度:window.screen.wid
获取文档宽高:
document.body.clientWidth/document.body.clientHeight
document.documentElement.scrollHeight/document.documentElement.scrollWidth
document.body.scrollHeight/dcth,window.screen.height
ument.body.scrollWidth
o
获取滚动条距离:
document.body.scrollTop/document.body.scrollLeft
window.scrollY/window.scrollX
document.documentElement.scrollTop/document.documentElement.scrollLeft
window.pageYOffset/window.pageXOffset

BOM,Dom 回顾的更多相关文章

  1. JavaScript:BOM&DOM

    BOM(Browser Object Model): feature: 1.BOM has no relevant standards. 2.The fundamental object of BOM ...

  2. JavaScript BOM DOM 对象

    title: JavaScript BOM DOM 对象 tags: JavaScript --- browser object model document onject model BOM对象 w ...

  3. 【转】了解nodejs、javascript间的关系!bom&dom&ecmascript

    地址:https://www.cnblogs.com/JetpropelledSnake/p/9450810.html bom&dom:https://www.cnblogs.com/wang ...

  4. BOM DOM

    http://www.cnblogs.com/yexiaochai/archive/2013/05/28/3102674.html DOM Document Object Model 文档对象模型 一 ...

  5. JS学习四(BOM DOM)

    BOM                Screen对象 console.log(window.width);//屏幕宽度 console.log(window.height);//屏幕高度 conso ...

  6. js BOM DOM

    BOM对象 BOM(浏览器对象模型),可以对浏览器窗口进行访问和操作.使用 BOM,开发者可以移动窗口.改变状态栏中的文本以及执行其他与页面内容不直接相关的动作. 简而言之就是使 JavaScript ...

  7. web3 - BOM&DOM

    一.BOM (浏览器对象模型) 浏览器对象模型 (BOM) 使 JavaScript 有能力与浏览器"对话". Window 对象 1.window.onresize // 1 w ...

  8. BOM,DOM常见操作和DHML

    BOM (Browser Object Model)浏览器对象模型,控制浏览器的一些行为 window对象 代表一个HTML文档 属性 页面导航的5个属性 self, parent, top, ope ...

  9. BOM&DOM

    BOM(浏览器对象模型) 1. location相关 . location.href 获取当前url . location.href="http://www.sogo.com" 跳 ...

随机推荐

  1. Unity发布WebGL时如何修改默认的载入进度条

    Unity发布WebGL版本后,需要去除Unity的Logo,首先关闭Splash Image去除Made with Unity启动画面(在File->Build Settings->Pl ...

  2. 使用 memoryview 和 struct 查看一个 GIF 图像的首部

    >>> import struct >>> fmt = '<3s3sHH' # ➊ >>> with open('filter.gif', ...

  3. SDVN

    Software Defined Vehicular Networks VANET 车载自组网(VANET)是指在交通环境中车辆之间.车辆与固定接入点之间及车辆与行人之间相互通信组成的开放式移动Ad ...

  4. Flask 扩展 缓存

    如果同一个请求会被多次调用,每次调用都会消耗很多资源,并且每次返回的内容都相同,就该使用缓存了 自定义缓存装饰器 在使用Flask-Cache扩展实现缓存功能之前,我们先来自己写个视图缓存装饰器,方便 ...

  5. 关于mule中使用jdbc时报No Suitable Driver found错误的问题

    错误大概信息: Exception in thread "main" org.mule.module.launcher.DeploymentStartException: SQLE ...

  6. faster-rcnn 结构杂谈

    faster-rcnn结构图: (只截取了最难理解的部分) 这个网络看似很复杂,但是理解了其中关键的层,就基本可以掌握这个结构了.要看源码!!要看源码!!要看源码 !!重要的事情说三遍. 关键的层: ...

  7. mysql数据库基本操作

    下载地址 http://www.mysql.com/downloads/mysql/ 端口号:3306 用户名:root 密码:自定义 连接到MySQL服务器 >mysql -uroot -pr ...

  8. AngularJS1.X学习笔记12-Ajax

    说到Ajax,你一定是思绪万千,想到XMLHttpRequest,$.ajax(),跨域,异步之类的.本文将探讨一下AngularJS的Ajax. 一.一个简单的例子 <!DOCTYPE htm ...

  9. 快速获取表单多条数据,使用ajax传递给后台

    当表单中有多条数据需要向后台传递时,一个一个的获取显然是不可取的办法,可以借助表单的serialize()方法获取. HTML: <form id="form"> &l ...

  10. confluence搭建详情

    Confluence安装&破解&汉化 编辑时间: 2017年7月7日18:01:13 1.介绍 Atlassian Confluence(简称Confluence)是一个专业的wiki ...