@wy
2017-02-16T20:31:58.000000Z
字数 5779
阅读 998
miaov
javascript课时共4个自然月，遇到法定节假日课程时间顺延。
课上内容：
简介js
js书写位置
获取元素
事件
window.onload
初识函数
变量
style属性操作
课上案例：
第一个例子
课后作业：
热身练习
讲解练习题：
热身练习.html
课上内容：
元素上的属性innerHTML、value、href、src
字符串定义和字符串拼接
+、+=操作符的使用
课上案例：
简易的留言板.html
课后作业：
讲解练习题：
课上内容：
if...else...语句
初始布尔值
简单运算符 > < ==、++、--
初识数组、定义数组、数组length、通过下标取值。
处理边界
课上案例：
按钮控制图片显示隐藏.html --- 判断display的值
按钮控制图片地址切换.html --- 变换状态切换
1-图片切换.html --- 图片地址为数字切换
2-图片切花.html --- 不规则的图片地址切换，过界处理
课后练习：
课上的图片切换
模拟手机短信发送
讲解练习题：
模拟手机短信发送.html --- 做完整
课上内容：
再次把图片切换做一遍
讲解练习题：
图片切换综合应用.html
控制多组图片.html
课上内容：
获取元素方法getElementsByTagName、queryselector、queryselectorAll
for循环语句、运行步骤、什么情况下使用for
函数、this关键字
课上案例：
鼠标移入li变色.html
生成100个div.html
课后练习：
点击生成V形并变换四个方向
讲解练习题：
课上内容：
回顾for循环，this关键字，操作符%
课上案例：
隔行变色.html
课后练习：
擦出图片.html
讲解练习题：
擦出图片.html
课上内容：
状态（开关）的使用
this的使用
属性操作、自定义属性
课上案例：
单选.html
多选.html
选项卡.html
讲解练习题：
好友列表
课上内容：
回顾for循环、++、--、自定义属性
课上案例：
轮播图.html --- 将元素写在页面中，不适用数组切换
讲解练习题：
课上内容：
讲解练习
课后练习
把讲解的练习多做
课上内容
数据类型
对象的定义和操作
类型转换 Number、String、Boolean、parsetInt、parseFloat
得到类型的运算符typeof
isNaN、NaN
课上案例
简易计算器.html
课后作业
无
课上内容：
算术运算符、赋值运算符、逻辑运算符、关系运算符、运算符优先级
判断最大值、
字符串方法charAt
数组方法push
练习讲解：
课上内容：
定义函数函数
函数传参
arguments
函数返回值
获取计算后的样式值的函数封装
课上案例：
获取计算后样式值.html
多个选项卡传参.html
课后作业：
修改文本框的值
练习讲解：
找到合适的值.html
修改文本框的值.html
课上内容：
switch case
while循环
for循环
停止循环break
跳过循环continue
课后作业：
搜狐列表
选项卡套选项卡
练习讲解：
搜狐列表
课上内容：
函数的定义、参数、返回值、、
函数的作用域
作用域链
闭包的理解和使用
课上案例：
多个里点击弹出下标值.html
课后作业：
商品累计
选项卡套选项卡
练习讲解：
选项卡套选项卡.html
商品累计.html
课上内容：
回顾课上的内容、讲解练习题
封装$函数
课上内容：
连续性定时器（setInterval）
延迟性定时器（setTimeout）
定时器编号
停止定时器（clearInterval、clearTimeout）
定时器管理
课上案例：
图片自动切换.html
下拉广告.html
课后作业：
练习讲解：
课上内容：
运动的产生
日期对象Date的使用
时间版运动库mTween的封装
tween.js的使用
课上案例：
自动轮播图.html
课后作业：
练习讲解：
课上内容：
透明度的处理
无缝滚动原理分析和实现
课上案例：
仿京东的图片淡隐淡出效
无缝滚动
课后作业：
练习讲解：
课上内容：
回顾定时器
课后作业：
多个div依次下落
课上内容：
定义日期对象
设置时间
获取年月日时分秒
getFullYear、getMonth、getHours()、getMinutes、getSeconds
课上案例：
倒计时
简易日历
练习讲解：
多个div依次下落
课上内容：
回顾日期对象
课上案例：
简易图片时钟.html
课后作业：
课上内容：
字符串方法
JSON的使用 JSON.parse、JSON.strinify
对象的定义和使用
for...in...
课后作业：
讲解课后练习:
课上内容：
完善TMeex库、使用对象和for in
课上案例：
div同时变换多个属性运动.html
课后作业：
课后练习:
课上内容：
数组方法
Math对象
课上案例：
首尾相接的数字.html
课后作业：
课后练习讲解:
课上内容：
递归
数组去重
冒泡排序
快速排序
课后作业：
消除表情小游戏
自动切换选项卡（递归写）
树形菜单（递归）
课后练习讲解:
课上内容：
回顾字符串数组方法
课上内容：
介绍DOM是什么？
节点类型 nodeType
节点关系：父子级、兄弟级、祖先级、子孙级
firstElementChild、lastElementChild、nextElementSibling、previousElementSibling
parentNode、children、childNodes
课上案列：
某个元素下的所有子元素变色
点击子元素关闭父元素
点击按钮操作各种DOM关系样式
课后作业：
鼠标移入移除布局作业
多级菜单
课上内容：
创建元素节点 createElement
插入元素 insertBefore、appendChild
删除节点 removeChild
克隆节点 cloneNode
替换节点 replaceNode
课上案例：
留言板（不全）
课后练习：
上移下移（可扩展运动版）
点击div掉下
商品筛选
课上内容：
定位父级：offsetParent
定位偏移获取：offsetLeft/offsetTop
元素到可视区距离：getBoundingClientRect
元素所在位置大小：clientWidth/clientHeight、offsetWidth/offsetHeight
行间属性操作：getAttribute、removeAttribute、setAttribute
页面滚动的距离 scrollTop/scrollLeft
课上案例：
练习讲解：
鼠标移入移除布局作业
树形菜单（可扩展json版）
课上内容：
操作表格:tBodies、rows、cells
获取表单控件的值：value
表单控件方法：focus、select
表单的事件：onfocus、onblur、onchange、oninput
课上案例：
留言板（不全）
课后练习：
讲解课后练习：
将所有没讲完，或者需要扩展的练习全部扫完
并且让他们自己写一遍。
课上内容：
open、close
navigator.userAgent
location、searh、hash
课上案列：
判断低版本IE浏览器
通过hash值切换数据
课后作业：
练习讲解：
课上内容：
什么是事件？
焦点事件：onfoucs、onblur、onchange、oninput
键盘事件：onkeydonw、onkeyup
事件对象、事件对象获取
keyCode、altKey、shiftKey、ctrlKey、clinetX、clientY
课上案列：
选择城市
微博输入文字框
div跟随鼠标
键盘移动div
课后作业：
div斜着跑
转向的图片
仿select
图片上下左右无缝切换
课上内容：
事件绑定、解除绑定
事件流、事件流三个阶段：事件捕获阶段、处于目标阶段、事件冒泡阶段
冒泡的优缺点
阻止冒泡：event.stopPropagation
事件默认行为,取消默认行为：event.preventDefalut()
课上案列：
冒泡的优点 --事件委托
冒泡的缺点 --阻止冒泡
阻止默认行为
右键菜单
课后作业：
练习讲解：
div斜着跑
转向的图片
课上内容：
拖拽的原理分析
拖拽的三大事件：mousedown、mousemove、mouseup
拖拽的封装
碰撞检测
碰撞检测的封装
课上案列：
限制范围的拖拽
磁力吸附
生成自由选区
课后作业：
课上内容：
自定义滚动条
滚轮事件：mousewheel/DOMMouseScroll
滚轮方向：wheelDelta/detail
滚动函数的封装
ready事件
课上案列：
自定义滚动条拖动框
加滚动版
鼠标改变数值
课后作业：
练习讲解：
QQ邮箱删除
照片墙
课上内容：
正则的作用
正则语定义：new RegExp
转义字符
match方法
test方法
replace方法
匹配范围
量词
课上实例：
匹配数字
验证字符串
课后作业：
课上内容：
replace
常用字符\d\D\w\W\s\S\1\2...
子项()
懒惰模式和贪婪模式
课上案例：
课后练习：
数据校验
验证邮箱
课上内容：
介绍面向对象
举例说明面向对象和面向过程的区别
分析面向对象特点
对象的创建
new运算符的使用
构造函数说明
new运算符的原理
属性和方法的问题
prototype的使用
proto说明
原型链分析
使用面向对象编写一个例子
面向对象编程总结
课上案例：
课上内容：
包装对象
包装对象的使用
一个关于包装对象的例子
hasOwnProperty
constructor
instanceOf
继承
继承原理
拷贝继承
类式继承
原型继承
课上案例：
继承拖拽.html
课上内容：
回顾面向对象知识点
课上案例：
模态框--面向对象.html
课上内容：
ES6中定义类 class
constructor的使用
extends继承的使用
课上案例：
模态框--class类.html
课上内容：
组件介绍
组件的特性
组件参数配置
组件方法实现
组件属性定义
自定义事件
课上案例：
模态框组件.html
拖拽组件.html
课上内容：
介绍jQuery
$的由来
jQuery库的整体架构
jQuery选择器
jQuery样式操作方式
jQuery链式写法及原理
Sizzle核心选择器
课上案例：
课上内容：
jQuery绑定事件处理程序的方式
jQuery DOM操作
节点选择器
创建节点
插入节点
删除节点
克隆节点
例子选项卡
筛选方法
课上案例：
课上内容：
盒模型相关，获取元素宽高
获取元素位置
获取滚动条位置
jq事件相关
自定义事件
课上案例：
瀑布流
拖拽
课上内容：
jquery提供的动画方法
执行动画 结束动画
动画队列的原理
课上案例：
实例-无缝轮播
课上内容：
深浅复制extend函数封装
jQuery中的插件定义和调用
第三方插件的使用
课上案例：
extend函数封装
拖拽插件
课上内容：
什么是ajax
ajax的作用
ajax的工作步骤
使用ajax请求数据
post和get的区别
异步和同步
课上内容：
post
上传、onprogress、上传进度
下载
拖拽上传
ajax封装
jsonp
跨域实例
jsonp封装
课上案例：
课后作业：
课上内容：
回顾jsonp
模板引擎
练习讲解：
课上内容：
cookie介绍
cookie封装
本地存储
localStorage
sessionStorage
课上案例：
模拟登陆
简易购物车
currentStyle/getComputedStyle
cssText和setAttribute
firstChild 、firstElementChild
Event对象对象兼容
事件侦听器：addEventListener、attachEvent
事件兼容：onmousewheel、DOMMouseScroll
Ajax兼容