一.this的使用

　　1.给一组元素绑定事件

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>this</title>
    <style>
        li{
            width:300px;
            border:1px solid #333;
            line-height: 50px;
            list-style: none;
            cursor:pointer;
        }
    </style>
</head>
<body>
    <ul>
        <li>衣服</li>
        <li>衣服</li>
        <li>衣服</li>
        <li>衣服</li>
        <li>衣服</li>
        <li>衣服</li>
    </ul>
    <hr>
    <button onclick="show(this)">点击</button>
    <script>
        //获取所有的li
        var list = document.getElementsByTagName('li');
        //绑定事件
        for(var i = 0; i<list.length; i++){
            list[i].onclick = function(){
                //此处的i是6
                //this触发事件的那个元素
                this.style.backgroundColor='pink';
            }
        }
    </script>
</body>
</html>

　　2.在元素内部通过事件属性使用

<button  onclick='change(this)'></button>
function change(ob){
        ob.style.color='red';
        }

二.鼠标事件

　　1.onclick                单击

　　2.ondblclick            双击

　　3.oncontextmenu    右击   --return false  阻止系统菜单弹出

　　4.onmouseover       鼠标划上元素

　　5.onmouseout　　   鼠标划出元素

　　6.onmousedown　　鼠标按下

　　7.onmouseup　    　鼠标抬起

　　8.onmousemove　　鼠标移动

三.键盘事件

　　1.onkeydown　　  键盘按下

　　2.onkeyup　　　　 键盘抬起

　　3.onkeypress　　  键盘按下（可打印的，可见的）

四.文档事件

　　1.onload　　             文档中的一切加载完毕

　　2.onunload　　         文档关闭的时候

　　3.onbrforeunload　　文档关闭之前

五.表单事件

　　1.onsubmit　　 提交

　　2.onreset　　   重置

　　3.onfocus　　   获取焦点

　　4.onblur　　     失去焦点

　　5.onchange　   内容发生改变（失去焦点）

　　6.onselect　　  当内容被选择（表单）

六.图片事件：

　　1.onload　　  加载完成

　　2.onerror　　 加载失败

　　3.onabort　　 加载中断

（实例之后专门整理）