2018-10-11

三大系列:

1. offset系列

offsetLeft | offsetTop
offsetWidth | offsetHeight
offsetParent 定位父级

2. client系列

clientHeight | clientWidth
可视区域的大小,包括元素的本身的宽高以及他的padding。
兼容的获取所有浏览器的可视区域


 window.innerHeight ||    高级浏览器
document.documentElement.clientHeight ||  IE
document.body.clientHeight   低版本的Chrome

clientTop | clientLeft
上边框或者左边框的宽度
on+resize 窗口大小改变的事件,窗口大小改变的时候就会自动触发。

3.scroll系列

scrollWidth | scrollHeight
onscroll窗口发生滑动的时候自动触发的事件
scrollTop | scrollLeft
窗口滑动过的距离


window.pageYOffset ||    高级浏览
document.documentElement.scrollTop ||   IE
document.body.scrollTop;   Chrome低级版本

4.document.body 获取页面的body

document.documentElement 获取页面的HTML元素

5.缓冲运动: 可以根据距离目标点的位置修改速度。距离目标越近速度越小。

缓冲运动的速度要进行取整。正值向上取整,负值向下取整。
speed = dest>=0?Math.ceil(dest/10):Math.floor(dest/10);
缓冲运动的停止条件判断是一个严格的值相等。

6.匀速运动的停止条件判断是一个范围。当结束位置距离目标位置的足够近(小于一次运动的距离)的时候就认为已经达到目标位置了。这个时候就可以清除定时器,然后将元素直接设置为目标位置。
 var dest = 400-div.offsetLeft;
speed = dest>=0?7:-7;
Math.abs(div.offsetLeft-400)<Math.abs(speed)
7.querySelectorAll 获取一组元素
8.对象:对象的键是字符串格式的,可以不加引号。

对象的键的值可以是任何数据类型。
json:json是js对象的字符串表达。
json数据的要求非常严格:
键与值必须是使用双引号。
键必须使用双引号。
值只能是数字,字符串,布尔值,数组,json。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • App测试点: 1、 安装查看在安装过程中存在的提示信息是否明确,意思是否明确在安装过程中,点击取消按钮,能否...
    理智_b3b0阅读 5,150评论 2 5
  • 【回顾行动目标】 快速,高效检索有效信息 【寻找事实结果】 001.面对数据源,只用常规升序/降序,只有两种结果 ...
    红_b1d3阅读 1,638评论 0 0
  • 不为人知的排序和筛选的高级用法 没有进入excel学习时,对于排序和筛选的用法,一直停留在最基本的用法上,就超喜欢...
    紫藤11阅读 1,079评论 0 0
  • jQuery 第一天 jQuery使用,jQuery选择器 jQuery整体框架设计 回顾js课程 jQuery ...
    Ories阅读 1,891评论 0 0
  • 《说地谈天》之永恒之恋(第357天) 生命的大石块 说地 一位专家拿了一个一加仑大口瓶放在桌上,把一堆拳头大小的石...
    一粒麦子_8c9d阅读 806评论 0 0