与浏览器进行交互的时候浏览器就会触发各种事件。比如当我们打开某一个网页的时候，浏览器加载完成了这个网页，就会触发一个 load 事件；当我们点击页面中的某一个“地方”，浏览器就会在那个“地方”触发一个 click 事件。
这样，我们就可以编写 JavaScript，通过监听某一个事件，来实现某些功能扩展。例如监听 load 事件，显示欢迎信息，那么当浏览器加载完一个网页之后，就会显示欢迎信息。
基础事件操作
监听事件
浏览器会根据某些操作触发对应事件，如果我们需要针对某种事件进行处理，则需要监听这个事件。监听事件的方法主要有以下几种：
1,HTML 内联属性（避免使用）on+事件动作( onclick )
2,DOM 属性绑定 on+事件动作( onclick )
2,使用事件监听函数 事件动作( click ) 不需要添加on
HTML 内联属性（避免使用）
HTML 元素里面直接填写事件有关属性，属性值为 JavaScript 代码，即可在触发该事件的时候，执行属性值的内容。
<button onclick="event()">点击这个按钮</button>
function event(){
alert('HTML 内联属性')
}
DOM 属性绑定
也可以直接设置 DOM 属性来指定某个事件对应的处理函数，这个方法比较简单：
var dd = document.getElementById('id')
dd.onclick = function(){
alert('你点击了这个按钮');
};
上面代码就是监听 element 节点的 click 事件。它比较简单易懂，而且有较好的兼容性。但是也有缺陷，因为直接赋值给对应属性，如果你在后面代码中再次为 element 绑定一个回调函数，会覆盖掉之前回调函数的内容。
虽然也可以用一些方法实现多个绑定，但还是推荐下面的标准事件监听函数。
使用事件监听函数
标准的事件监听函数如下：
element.addEventListener(<event-name>, <callback>, <use-capture>);
var dd = document.getElementById('id')
dd.addEventListener('click',function(){
alert('使用事件监听函数')
})
用标准事件监听函数改写上面的例子：
var btn = document.getElementsByTagName('button');
btn[0].addEventListener('click', function() {
alert('你点击了这个按钮');
}, false);
这里最好是为 HTML 结构定义个 id 或者 class 属性，方便选择，在这里只作为演示使用。
移除事件监听
当我们为某个元素绑定了一个事件，每次触发这个事件的时候，都会执行事件绑定的回调函数。如果我们想解除绑定，需要使用 removeEventListener 方法：
var dd = document.getElementById('id')
dd .removeEventListener('click',function(){
alert('移除事件监听')
});
需要注意的是，绑定事件时的回调函数不能是匿名函数，必须是一个声明的函数，因为解除事件绑定时需要传递这个回调函数的引用，才可以断开绑定。例如：
var fun = function() { // function logic};
element.addEventListener('click', fun,false);
element.removeEventListener('click', fun, false);
pc电脑端 事件动作 （jquery一样）
| 事件属性 | 当发生以下情况，出现此事件 | 重要性 |
| -- | -- |
| onclick | 点击某个对象的时候 | 重要 |
| onchange | 用户改变域的内容 | 重要 |
| onload | 某个页面或图像被完成加载 | 重要 |
| onmousemove | 鼠标被移动 | 重要 |
| onmousedown | 某个鼠标按键被按下 | 一般 |
| onmouseout | 鼠标从某元素移开 | 一般 |
| onmouseover | 鼠标被移到某元素之上 | 一般 |
| onmouseup | 某个鼠标按键被松开 | 一般 |
| onsubmit | 提交按钮被点击 | 一般 |
| onreset | 重置按钮被点击 | 一般 |
| onresize | 窗口或框架被调整尺寸 | 一般 |
| onfocus | 元素获得焦点 | 一般 |
| onblur | 元素失去焦点 | 一般 |
| ondblclick | 鼠标双击某个对象 | 不重要 |
| onkeydown | 某个键盘的键被按下 | 不重要 |
| onkeypress | 某个键盘的键被按下或按住 | 不重要 |
| onkeyup | 某个键盘的键被松开 | 不重要 |
| onabort | 图像加载被中断 | 不重要 |
| onselect | 文本被选定 | 不重要 |
| onunload | 用户退出页面 | 不重要 |
移动端端 事件动作
| 事件属性 | 当发生以下情况，出现此事件 | 重要性 |
| -- | -- |
| tap | 手指放到屏幕上的时候触发，zepto等移动端插件 | 重要 |
| touchstart | 手指放到屏幕上的时候触发 | 重要 |
| touchmove | 手指在屏幕上移动的时候触发 | 重要 |
| touchend | 手指从屏幕上拿起的时候触发 | 重要 |
| touchcancel | 系统取消touch事件的时候触发。不详 | 不重要 |
这个可以不看，这个是移动端的事件
client / clientY：// 触摸点相对于浏览器窗口viewport的位置
pageX / pageY：// 触摸点相对于页面的位置
screenX /screenY：// 触摸点相对于屏幕的位置
identifier： // touch对象的unique ID
js 手机端触发事事件、javascript手机端/移动端触发事件
http://blog.sina.com.cn/s/blog_6d3f840a0101mchu.html
