jquery 筆記 事件
更新時間：2011年11月02日 11:06:43 作者：
寫js已經(jīng)有很久了，但是對js的詳細了解還是很膚淺的，這幾天在看jquery，在其中有一些新的發(fā)現(xiàn)和體會，記錄下來
瀏覽器模型：
1、DOM第0級模型
事件處理程序通過吧函數(shù)實例的引用指派到DOM元素的屬性而聲明。這也是我們最常見的，如onclick等
<img onclick="alert('hello');" src="1.jpg" />
$("img").onmouseover = function(){alert("hello");}
（1）、其中比較好玩的是Event實例和事件冒泡
Event實例是大多數(shù)瀏覽器把事件的類實例作為第一個參數(shù)傳給函數(shù)，但是ie中則是將event指定到window的屬性；在獲取目標元素w3c標準瀏覽器存在target，ie則取srcElement屬性，為兼容事件如下寫：
$("img").onclick=function(event){
if(!event) event = window.event;
var target = event.target?event.target:event.srcElement;
}
（2）、事件冒泡
目標元素獲得機會吃力事件，事件模型堅持目標元素的父元素，看是否為同類型建立了處理程序，如果是，則也調(diào)用處理程序，直到DOM樹頂部
對于w3c標準瀏覽器可使用event的stopPropagation(),對于ie可使用event的cancelBubble取消冒泡
2、第2級模型
解決0級模型中每個屬性存儲事件只能注冊一個處理程序缺陷。
$("img").addEventListener('click',function1,false).addEventListener('click',function2,false);
在2級模型中，事件被觸發(fā)，先從DOM樹向下傳播到目標元素（捕捉階段），再向上冒泡，上面的addEventListener第三個參數(shù)為false時建立冒泡型處理程序，為ture時建立捕捉型處理程序。
這里的捕捉型也是第一次聽說，因為ie6和7就不支持第2級模型，所以也難怪，但部分ie瀏覽器支持類似冒泡型的有attachEvent(eventName,handler)。
那么jquery的bind則我們解決了這些。。。
參考《jquery實戰(zhàn)》
1、DOM第0級模型
事件處理程序通過吧函數(shù)實例的引用指派到DOM元素的屬性而聲明。這也是我們最常見的，如onclick等
復(fù)制代碼 代碼如下:
<img onclick="alert('hello');" src="1.jpg" />
$("img").onmouseover = function(){alert("hello");}
（1）、其中比較好玩的是Event實例和事件冒泡
Event實例是大多數(shù)瀏覽器把事件的類實例作為第一個參數(shù)傳給函數(shù)，但是ie中則是將event指定到window的屬性；在獲取目標元素w3c標準瀏覽器存在target，ie則取srcElement屬性，為兼容事件如下寫：
復(fù)制代碼 代碼如下:
$("img").onclick=function(event){
if(!event) event = window.event;
var target = event.target?event.target:event.srcElement;
}
（2）、事件冒泡
目標元素獲得機會吃力事件，事件模型堅持目標元素的父元素，看是否為同類型建立了處理程序，如果是，則也調(diào)用處理程序，直到DOM樹頂部
對于w3c標準瀏覽器可使用event的stopPropagation(),對于ie可使用event的cancelBubble取消冒泡
2、第2級模型
解決0級模型中每個屬性存儲事件只能注冊一個處理程序缺陷。
復(fù)制代碼 代碼如下:
$("img").addEventListener('click',function1,false).addEventListener('click',function2,false);
在2級模型中，事件被觸發(fā)，先從DOM樹向下傳播到目標元素（捕捉階段），再向上冒泡，上面的addEventListener第三個參數(shù)為false時建立冒泡型處理程序，為ture時建立捕捉型處理程序。
這里的捕捉型也是第一次聽說，因為ie6和7就不支持第2級模型，所以也難怪，但部分ie瀏覽器支持類似冒泡型的有attachEvent(eventName,handler)。
那么jquery的bind則我們解決了這些。。。
參考《jquery實戰(zhàn)》
相關(guān)文章
下面小編就為大家?guī)硪黄猨query <li>標簽 隔若干行加空白或者加虛線的方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-12-12
jQuery插件jqGrid動態(tài)獲取列和列字段的方法
這篇文章主要介紹了jQuery插件jqGrid動態(tài)獲取列和列字段的方法,結(jié)合實例形式分析了表格插件jqGrid針對表格字段屬性相關(guān)操作技巧,需要的朋友可以參考下2017-03-03
Chosen 是一個JavaScript插件，它能讓丑陋的、很長的select選擇框變的更好看、更方便,不僅如此，它更擴大了，增長了主動篩選的功能。接下來通過本文給大家分享chosen 三級聯(lián)動功能，一起看看吧2017-03-03
jQuery Ajax 實例代碼 ($.ajax、$.post、$.get)
下面小編就為大家?guī)硪黄猨Query Ajax 實例代碼 ($.ajax、$.post、$.get)。小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考2016-04-04
通過過濾器可以獲取特定的表單元素，如非輸入項目或者單選按鈕的已選項目等元素，可用的2011-07-07
好久沒有溫習(xí)JS了。 最近看到VS2010把Jquery作為JS標準庫納入了Web項目里，再不會用Jquery，真怕自己“OUT”了。2010-05-05
下面小編就為大家?guī)硪黄斦刯Query中的一些正則匹配表達式。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-03-03
jquery 讀取頁面load get post ajax 四種方式代碼寫法
jquery 讀取頁面load get post ajax 四種方式代碼寫法，學(xué)習(xí)jquery的朋友可以參考下。2011-04-04
測試代碼如下,本例子中設(shè)置的著色比較多，哈，都是隨便輸些數(shù)字進去的，感覺這樣更容易讓大家看到效果，呵，如果我的講的有哪不好麻煩大家多留言教導(dǎo)下^^2009-07-07
jQuery實現(xiàn)table表格checkbox全選的方法分析
這篇文章主要介紹了jQuery實現(xiàn)table表格checkbox全選的方法,結(jié)合實例形式分析了jQuery事件響應(yīng)與元素遍歷實現(xiàn)table表格checkbox元素狀態(tài)動態(tài)修改相關(guān)操作技巧,需要的朋友可以參考下2018-07-07