一 摘要
在这里,不管你学过还是没学过,给大家总结一下jQuery的DOM事件操作.
二 具体内容
1. js页面载入事件(原生方式)
第一种内嵌写法:
第二种以匿名函数方式写法
2. jQuery页面载入事件
第一种写法:
第二种写法:
第三种写法
3.两者的区别
第一 jquery加载事件可以同时使用多个，原生方式只有一个
第二 jquery加载事件比原生加载事件执行速度快
第三 jquery加载事件执行时间点，dom树结构在内存中绘制完毕就执行加载
原生方式加载执行时间点，全部内容在浏览器里边呈现出来才会执行
第四 原生没有简写(window.onload),而后者可以简写$();
第五 jquery加载事件捕捉的时间点不一样
1) 内容绘制完毕之后就捕捉时间 DOMContentLoaded
2) 原生方式是内容在浏览器显示完毕之后再来捕捉window.onload
4.jQuery事件绑定
1.简单的事件绑定
效果:
2.可以为多个不同的事件类型，绑定同一个处理过程
效果
3.可以为同一个对象同时绑定多个不同类型事件
效果
4.可以为同一个对象的同一类型事件绑定多个处理过程
效果
5.事件的取消
5.jQuery事件的合并
Query有两个合成事件—-hover()和toggle(),这两个方法都是jQuery自定义的方法
1、hover()方法
语法结构为 hover(over,out)
当鼠标移动到一个匹配的元素上面时，会触发指定的第一个函数。当鼠标移出这个元素时，会触发指定的第二个函数。而且，会伴随着对鼠标是否仍然处在特定元素中的检测（例如，处在div中的图像），如果是，则会继续保持“悬停”状态，而不触发移出事件（修正了使用mouseout事件的一个常见错误）。
over:鼠标移到元素上要触发的函数
out:鼠标移出元素要触发的函数
这个函数很好理解，而且实际开发中会有很多妙用。
具体实现
效果
1、toggle()方法
语法结构 toggle(fn1,fn2,fn3...fnN)
toggle()方法用于用于绑定两个或多个事件处理器函数，以响应被选元素的轮流的 click 事件。
fn:第一数次点击时要执行的函数。
fn2:第二数次点击时要执行的函数。
fn3,fn4,...:更多次点击时要执行的函数。
效果图
