2018.9.7 星期五
复习：
HTML绑定:
DOM0级绑定:
div.onclick = handle;
div.onclick = handle2;
//如果同一节点同一事件类型，绑定两个函数，后者覆盖前者。
div.onclick = null;
DOM2级绑定:
非IE8及以下：
div.addEventListener(‘click’,handle,true/false);
div.addEventListener('click',handle1,true/false);//如果同一元素同一事件类型绑定了多个函数，依次执行div.removeEventListener('click',handle,true/false);//解绑IE8及以下：div.attachEvent('onclick',handle);div.attachEvent('onclick',handle1);//如果同一元素同一事件类型绑定了多个函数，倒叙执行div.detachEvent('onclick',handle);//解绑匿名函数在DOM2级无法解绑。
事件对象event:
DOM0级
function handle(event){}
非IE8及以下：eventIE8及以下：window.event
DOM2级
function handle(event){}
event就是事件对象
阻止冒泡：
非IE8及以下：
event.stopPropagation()
IE8及以下：
event.cancelBubble() = true;
阻止默认：
非IE8及以下：
event.preventDefault()
IE8及以下：
event.returnValue = false;
获取源元素：
非IE8及以下：
event.target
event.currentTarget 当前目标对象，和this一样
IE8及以下：
event.srcElement
this指向：
非IE8及以下：
this == event.currentTarget
IE8及以下：
this–>window
其他事件类型：
click 点击
mouseenter 鼠标进入元素mouseleave 鼠标离开元素 mouseover 鼠标进入元素【支持子元素】mouseout 鼠标离开元素【支持子元素】 keydowm 键盘按下keyup 键盘抬起focus 聚焦事件，input输入框blur 失焦，
event的其他属性：
clientX 视口区的x坐标
clientY 视口区的y坐标
screenX 屏幕区的x坐标
csreenY 屏幕区的y坐标pageX 页面区的x坐标
pageY 页面区的y坐标
如果页面不滚动的话，页面区与视口区的(0,0)重合
绘图：
mousedown:
鼠标按下的时候，创建div，设置位置，将位置放到外部变量中，
将div放到外部变量中，以供mouseover和mouseup使用。
mouseover:鼠标移动的时候，判断是否有div，如果有的话，设置其宽高。宽高就是移动到的位置减去开始的位置。mouseup:清空外部变量div如果不清空，在以下情况下会有异常：鼠标按下-鼠标移动-鼠标抬起-鼠标移动设置上一个div的宽高
显示与隐藏：
点击按钮进行显示与隐藏
//实现图片轮播
多张图片只显示一张
图片[]
显示图1
时隔2s
显示图2
时隔2s
显示图3
count=0;
setIterval(function(){
var imgs = document.images;
imgs.forEach(function(item,index){
if(index == count%imgs.length){
item显示
}else{
item不显示
}
});
count++;
},2000);
超时调用：
setTimeout(function(){
alert(1);
},2000); //多少秒后执行，只执行一次
clearTimeout(function(){
alert(1);
},2000); //每几毫秒执行一次
间歇调用：
setInterval(function(){
alert(1);
})
//在网页上显示当前时间
alert() 确认框
prompt(‘提示信息’) 会话框