一、JS事件类型
avaScript可以处理的事件类型为：鼠标类型、键盘类型和HTML类型！
注意：所有的事件处理函数都由两个部分组成，on+事件名称。
例如：click事件，处理函数就是onclick！
第一种：鼠标事件。
click： 单击鼠标按钮时触发；
dblclick：当用户双击主鼠标按钮时触发；
mousedown： 当用户按下鼠标还未弹起时触发；
mouseup： 当用户释放鼠标按钮时触发；
mouseover： 当鼠标移到某个元素上方时触发；
mouseout： 当鼠标移出某个元素上方时触发；
mousemove：当鼠标指针在元素上移动时触发；
mouseenter： 在鼠标光标从元素外部首次移动至元素范围内触发，不参与冒泡；
mouseleave：鼠标移出；
第二种：键盘事件。
keydown： 当用户按下键盘上任意键时触发，如果按住不放，会重复触发；
keyup： 当用户释放键盘上的键触发；
keypress： 当用户按下键盘上的字符键时触发，如果按住不放，会重复触发；
第三种：HTML事件。
load： 当页面完全加载后在window上面触发，或当框架集加载完毕后在框架集上触发；
unload： 当页面完全卸载后在window上面触发，或当框架集卸载后在框架集上触发；
select： 当用户选择文本框（input或textarea）中的一个或多个字符触发；
change： 当文本框（input或textarea）内容改变且失去焦点后触发；
input： 输入；
focus： 当页面或者元素获得焦点时在window及相关元素上面触发；
blur： 当页面或元素失去焦点时在window及相关元素上触发；
submit： 当用户点击提交按钮在
元素上触发；reset： 当用户点击重置按钮在元素上触发；
resize： 当窗口或框架的大小变化时在window或框架上触发；
scroll： 当用户滚动带滚动条的元素时触发；
以上就是这三种事件类型，千万记住事件之前要加“on”；
二、js事件和jquery事件的区别
通过《JavaScript 事件参考手册》 和《 jQuery 1.4.1 中文参考》截图对比如下：
仔细观察，会发现jQuery中的事件和javascript中的事件有一个明显区别：javascript中的事件为onclick，那么jQuery中的事件则为click()或click(fn)。其他方法以此类推。
一、本质区别：
1.js都知道是网页脚本语言，类似java是一种开发常用语言；
2.jQuery是基于js语言封装出来的一个前端框架；
所以最本质的区别就是js是一种语言，而jQuery是基于该语言的一种框架。除却最本质的区别还有一些用法上的差别。
二、用法区别：
1.外观上jQuery对象比js对象多了"$()"一层马甲，这是最直观的区别；
2.操作内容
①.非表单元素（如果是文本就用text方法，如果是html代码就用html方法）
例：div.text();——无参数的情况下是取值
div.text("aaaa");——有参数的情况下是赋值
div.html();——无参数的情况下是取值
div.html("aaaa");——有参数的情况下是赋值
②.表单元素
JS：div.value;——取值；div.value = xxx;——赋值
JUQERY：div.val();——无参数是取值，有参数是赋值。
3.操作属性
JS里面用来操作属性的方法是
div.setAttribute("","");——设置属性、修改属性
div.removeAttribute("");——移除属性，引号里面写一个属性名
div.getAttribute();——获取属性
JQUERY里面用来操作属性的方法
添加属性：div.attr("test","aa");——给这个attr方法加入参数，属性名叫做test，属性的值是aa
移除属性：div.removeAttr("test");——移除test这条属性
获取属性：div.attr("test");——在attr方法里面直接写入一个属性的名就可以了
4.操作样式
JS里面操作样式的关键字是style
例：div.style.backgroundColor = "red";——把这个div的背景色设置成为了红色
JQUERY里面操作样式的关键字是css
例：div.css("background-color","yellow");——把这个div的背景色变为黄色，在这里CSS里面所有的样式和css样式表里面的样式是一模一样的没有任何变化
JS操作样式的方法只能获取内联样式，不能取内嵌的和外部的！！！！！
JQUERY操作样式的方法可以是内联的也可以是内嵌的。
三、 事件对象（事件对象常用的属性和方法）
1、type
事件的类型，如onlick中的click；
2、srcElement/target
事件源，就是发生事件的元素；
3、button
声明被按下的鼠标键，整数，1代表左键，2代表右键，4代表中键，如果按下多个键，酒把这些值加起来，所以3就代表左右键同时按下；（firefox中 0代表左键，1代表中间键，2代表右键）
4、clientX/clientY
事件发生的时候，鼠标相对于浏览器窗口可视文档区域的左上角的位置；(在DOM标准中，这两个属性值都不考虑文档的滚动情况，也就是说，无论文档滚动到哪里，只要事件发生在窗口左上角，clientX和clientY都是 0，所以在IE中，要想得到事件发生的坐标相对于文档开头的位置，要加上document.body.scrollLeft和 document.body.scrollTop)
5、offsetX,offsetY/layerX,layerY
事件发生的时候，鼠标相对于源元素左上角的位置；
6、x,y/pageX,pageY
检索相对于父要素鼠标水平坐标的整数；
7、altKey,ctrlKey,shiftKey等
返回一个布尔值；
8、keyCode
返回keydown何keyup事件发生的时候按键的代码，以及keypress 事件的Unicode字符；(firefox2不支持 event.keycode，可以用 event.which替代 )
9、fromElement,toElement
前者是指代mouseover事件中鼠标移动过的文档元素，后者指代mouseout事件中鼠标移动到的文档元素；
10、cancelBubble
一个布尔属性，把它设置为true的时候，将停止事件进一步起泡到包容层次的元素；(e.cancelBubble = true; 相当于 e.stopPropagation();)
11、returnValue
一个布尔属性，设置为false的时候可以组织浏览器执行默认的事件动作；(e.returnValue = false; 相当于 e.preventDefault();)
12、attachEvent(),detachEvent()/addEventListener(),removeEventListener
为制定DOM对象事件类型注册多个事件处理函数的方法，它们有两个参数，第一个是事件类型，第二个是事件处理函数。在
attachEvent()事件执行的时候，this关键字指向的是window对象，而不是发生事件的那个元素；
13、screenX、screenY
鼠标指针相对于显示器左上角的位置，如果你想打开新的窗口，这两个属性很重要；
