加给元素：
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. docker 学习之一：docker 安装

    核心概念1. 镜像是一个只读的模板类似于安装系统用到的那个iso文件我们通过镜像来完成各种应用的部署. 2. docker容器镜像类似于操作系统而容器类似于虚拟机本身.它可以被启动.开始.停止.删除等 ...

  2. Jmeter 后置处理器 BeanShell_PostProcessor 适用思考

    首先摘抄一段官方文档的话: The following BeanShell variables are set up for use by the script: log - (Logger) - c ...

  3. css3 背景色 实现边框渐变运动动画

    css3 #body_id { animation: myfirst 10s ease-in-out -2s infinite alternate; /* Firefox: */ -moz-anima ...

  4. 201621123050 《Java程序设计》第2周学习总结

    1.本周学习总结 java的数据类型 基本数据类型:介绍了java特有的boolean 引用数据类型 String:不变性:需要频繁修改时使用StringBuilder 包装类:自动拆.装箱 数组 一 ...

  5. WPF自学入门（十）WPF MVVM简单介绍

     前面文章中,我们已经知道,WPF技术的主要特点是数据驱动UI,所以在使用WPF技术开发的过程中是以数据为核心的,WPF提供了数据绑定机制,当数据发生变化时,WPF会自动发出通知去更新UI. 我们不管 ...

  6. map的infowindow的show事件(ArcGIS API for JS)

  7. python基础学习篇章一

    一. 对Python的认识 1. Python的标准实现方式是将源代码的语句编译为字节码的形式,之后再将字节码解释出来.由于字节码是一种与平台无关的形式,字节码具有可移植性.但是Python没有将代码 ...

  8. 第二章 Idea搭建maven

    第二章 Idea搭建maven 1.配置Maven的环境变量 a.首先我们去maven官网下载Maven程序,解压到安装目录,如图所示: b.配置M2_HOME(MAVEN_HOME)的环境变量,然后 ...

  9. php最新版本配置mysqli

    从官网上下载php后(我下的是php7.2.3版本),本想做个mysql的连接,但是无论怎么配置mysqli扩展,发现mysqli都没法用. 从百度上搜的那些方法都没法用,发现都是一些在php.ini ...

  10. WebApi 的三种寄宿方式 (一)

    最近逛博客园,看到了Owin,学习了一下,做个笔记,说不定将来哪天就用上了 关于 Owin 的介绍,百度解释的很清楚了: https://baike.baidu.com/item/owin/28607 ...