事件模型：javascript相关
事件模型的概念是浏览器的内容，却又与javascript相关
DOM第0级事件模型
在出现标准的事件模型之前，网景公司的网景航海家浏览器中引入了事件模型的概念。
$("#someId")[0].onclick = function(event){//...}
<img src="..." onclick="someFunction();" />
Event实例
javascript的每一个函数都有一个event实例作为默认参数。
在非IE浏览器中，event作为一个类的实例，传递给函数；在IE中，Event类的实例赋给了window.event变量。
事件冒泡
当点击一个元素的时候，这个元素的点击事件触发以后，包含这个元素的父元素的点击事件也会触发，以此类推，直到HTML元素。
这种特性成为冒泡事件。
阻止冒泡事件
event实例有一个stopPropagation()方法，这个方法能够阻止冒泡事件的继续发生。
而IE的做法是把event的一个名叫cancelBubble的属性的值设为true。
DOM第2级事件模型
$("someId")[0].addEventListener("click", function(event){//some work to do}, false);
这里面click是eventType，常见的有click，dbclick，blur，mouseover等；
function就是针对这个元素的eventType事件的处理函数；
false，成为useCapture。
这个useCapture的值为true的时候，发生冒泡的逆运算；false的时候，发生冒泡；
这种形式的好处是可以给一个元素追加多个同意eventType类型的函数处理；
jQuery事件模型：jQuery相关
bind(eventType, data, listener)
给一个包装集中的各个元素的eventType类型的event追加一个listener类型的处理函数，而data能够传递给默认的event实例的data属性
eventType支持"click.editMode"这种形式，这种形式处理的仍然是click事件，但是这个click事件只有在editMode模式下有效。
导致模式失效的是下面的unbind方法；
one(eventType, data, listener)
跟bind基本相同，不过这个元素上绑定的这个事件类型发生一次之后自动移除。
unbind(eventType, listener)
unbind(evnet)
就是把绑定到元素上的eventType类型的event处理函数去除掉
trigger(eventType)
触发指定的eventType类型的event。
这个方法仅仅是触发这个event，不会发生连带反应。
toggle(listenerOdd, listenerEven)
点击事件，当点击次数为奇数次时触发listenerOdd函数，偶数次时触发listenerEven函数。
hover(overListener, outListener)
覆盖事件，当覆盖当前元素时触发overListener函数，当从当前元素上移开时触发outListener函数。
$(":checkbox").click(function(event){
var checked = this.checked; // 判断当前checkbox是否为选中状态
$("div", $(this).parents("div:first")) // 从当前checkbox元素的父节点中找到第一个div元素，并且从这个div元素内部查找div元素。
.css("display", checked ? "block" : "none");
});
$(‘span[price] input[type=text]‘).change(function(event){ // 查找拥有price属性的span元素的子节点中类型为text的input元素
$(‘~ span:first‘, this) // this指代的是input元素，查找this的兄弟节点中第一个span
.text( // 设定其span的text内容
$(this).val() * $(this).parents("span[price]:first").attr(‘price‘); // 获取input的值，乘以这个input元素的父节点中第一个拥有price属性的span的特性price的值
)
});
jQueryInAction Reading Note 4.,布布扣,bubuko.com