js基本语法+es6（异步）+js内部原理（闭包，原型链，继承）。 我们BOM浏览器进行操作,DOM文档，事件。：js文档理论
offset，client，scroll。+ 动画特效。 + js交互案例。：页面一些特性。
记住50个案例，就好！
BOM: 1 分时间问候案例。 2 隐藏明文案例 3管理二维码案例。4循环精灵图。 5显示隐藏文本框内容
6密码框验证信息。7 排他思想。 8百度换肤 9表格各行变色。10 购物车 表格全选。11tab切换布局！12下拉菜单。
13 发布留言。删除留言。14动态生成表格。 15禁止选中文字。 16获取鼠标的坐标。17 快递单号查询。
BOM: 1 5s后端自动关闭广告。 2 倒计时定时器。 3 5s跳转网页。
offset： 1 拖动模态框。 2 放大镜效果。3 淘宝固定侧边栏。
动画： 1动态移动效果。
综合：轮播图。
0JS特效
-
图片切换 衣服相册切换效果
初学者小白实现图片切换 封装图片切换代码 图片切换完整版 -
显示和隐藏图片
-
关闭小广告
-
百度换肤
-
千千音乐盒实现全选和反选
-
P1111 表单验证 随机验证码校验 上传图片验证
-
P1414 发布评论
-
P1515 九宫格布局 九宫格布局定位实现
-
P1717 日期特效
-
定时器的回顾 数字时钟案例
-
transform的应用
-
长图滚动案例
1 offset,client,scroll家族。
css里面获取位置,盒子的大小，。但是如何通过js来获取呢？那么 需要通过offset
offset 偏移量。
element.offsetTop , offsetLeft:距离左边的位置，和顶部的位置。 没有右边和下边。
距离是有标准的！以什么为标准呢。如果父元素，以父元素。没有父元素，以body为准。
element.Width, element.Height : 盒子本身的宽度和高度。
（包括padding，border）
element.offsetParent: 获取父元素的。
返回带有定位的父亲，一级一级向上找，否则返回的是body。
element.parentNode返回的是最近一级的亲父亲，无论父亲有没有定位。
offset和style的区别。
1 e.offsetWidth <->e.style.width style只能获取行内样式值。不能获取style里面的。
2 offset带来的数字的，不带单位。e.style.获得带有单位的字符串。
3 e.offsetWidth 包含：padding+border+width。e.style.width
4 e.offset只能读取，不能改。 e.style.width ='200px' 可以读可以更改。
因此想要获取元素的大小位置，offset更合适。 如果想改变元素，style更合适。
1 获得元素 距离 带有定位父元素的位置。 offsetParent.
2 获取元素自身的大小。
3 返回的数值不带单位。
案例一： 获取鼠标的坐标。
鼠标在页面的坐标。 e.PageX e.PageY
子距离左侧的距离。e.offsetWidth,e.offsetTop
client： client和offset基本一样。除了element.clientWidth ,e.clientHeight:不包含边框！
立即执行函数：1.写法 ( function(){} ) () . ( fcuntion(){} () )
2.第二个()可以传入参数。
3. 独立创建一个作用域。所有变量都是局部变量。
元素滚动scroll系列。
scrollHeight,scrollWidth: 不包含边框，指的是实际大小。尤其是滚动距离。
元素的距离：
offset 系列主要获取的是元素的位置： offsetLeft，offsetTop
client经常获取元素的大小： client Width, clientHeight
scroll经常获取滚动的距离：scrollTop,scrollLeft
页面的滚动距离：window.pageXoffset获得
2 动画。基本动画，匀速动画，幻速动画，透明度动画，动画封装。
动画函数封装！
定时器setInterval（）不断移动盒子位置。
1 获得盒子当前的位置。
2 盒子加一个位置。
3 定时器不断重复这个动作。
4 加一个结束定时器的条件。
5 此元素需要定位才可以，才能使用e.style.left
3 常用js特效。
4 事件。 事件流。事件对象。事件处理程序。事件对象属性。
mouse enter : 只会经过自身盒子会触发。不会冒泡。mouseleave也不会冒泡。
mouse over: 经过自身盒子会触发，经过子盒子还会触发。子盒子冒泡到父盒子。