加给元素：
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. Post Office

    Post Office poj-1160 题目大意:给你在数轴上的n个村庄,建立m个邮局,使得每一个村庄距离它最近的邮局的距离和最小,求距离最小和. 注释:n<=300,m<=min(n, ...

  2. linux小白成长之路1————通过Parallels安装CentOS虚拟机

    以下是通过Mac版Parallels安装CentOS虚拟机的教程: 1.在Parallels向导中选择"下载CentOS",点击"继续":  2.点击&quo ...

  3. JavaScript(第十三天)【内置对象】

    学习要点: 1.Global对象 2.Math对象 ECMA-262对内置对象的定义是:"由ECMAScript实现提供的.不依赖宿主环境的对象,这些对象在ECMAScript程序执行之前就 ...

  4. Beta总结

    45°炸 031502601 蔡鸿杰 031502604 陈甘霖 031502632 伍晨薇 一.写在Beta项目前 Beta 凡 事 预 则 立 二.GitHub传送门 Beta冲刺重要版本 三.用 ...

  5. alpha-咸鱼冲刺day3-紫仪

    总汇链接 一,合照 emmmmm.自然还是没有的. 二,项目燃尽图 三,项目进展 今天把数据库的表给建好了,学长那边把登陆跟注册页面也做好了(纯页面,html5+css的那种) 四,问题困难   日常 ...

  6. 如何解决python中使用flask时遇到的markupsafe._compat包缺失的问题

    在使用python进行GUI的程序编写时,使用flask时出现错误: 在使用pip freeze进行查看已下载的包时显示MarkupSafe与Jinjia2都已安装: 在网上查阅一些资料后发现,在py ...

  7. 201621123043《java程序设计》第五周学习总结

    1. 本周学习总结 1.1 写出你认为本周学习中比较重要的知识点关键词 接口. Comparable接口 .Comparator接口.compareTo. 1.2 尝试使用思维导图将这些关键词组织起来 ...

  8. day-3 python多线程编程知识点汇总

    python语言以容易入门,适合应用开发,编程简洁,第三方库多等等诸多优点,并吸引广大编程爱好者.但是也存在一个被熟知的性能瓶颈:python解释器引入GIL锁以后,多CPU场景下,也不再是并行方式运 ...

  9. python之路--day15--常用模块之logging模块

    常用模块 1 logging模块 日志级别:Noset (不设置) Debug---(调试信息)----也可用10表示 Info--(消息信息)----也可用20表示 Warning---(警告信息) ...

  10. 算法题丨3Sum Closest

    描述 Given an array S of n integers, find three integers in S such that the sum is closest to a given ...