摘要:決定還是繼續寫博客,記錄工作學習中遇到的問題,每天晚上對學習和遇到的問題進行總結。
決定還是繼續寫博客,記錄工作學習中遇到的問題,每天晚上對學習和遇到的問題進行總結。
1.DOM事件1.HTML事件處理程序
2.DOM的0級事件(把一個函數函數賦值給一個事件處理程序屬性)element.onclick(function(){})
3.DOM的二級事件(element.addEventListener(type,fn,false),(false添加到冒泡階段)、
element.attachEvent(type,fn,false))
var EventUtil = { addEvent: function (element, type, fn) { if (element.addEventListener) { element.addEventListener(type, fn, false); } else if (element.attachEvent) { element.attachEvent("on" + type, fn); //兼容IE } else { element["on" + type] = fn; //DOM的0級 } }, removeEvent: function (element, type, fn) { if (element.removeEventListener) { element.removeEventListener(type, fn, false); } else if (element.detachEvent) { element.detachEvent("on" + type, fn); } else { element["on" + type] = null; } } }3.小例子
HTML結構
JS代碼
我們現在給這個按鈕添加事件
//隨便寫一個函數,假設觸發這個按鈕的點擊事件后,會調用這個函數
function showMsg(event) { alert(event.target.nodeName); //會把綁定這個事件的標簽的名字顯示出來 event.stopPropagation(); //阻止冒泡 event.preventDefault(); //阻止默認行為 } //獲取這個按鈕 var btn0 = document.getElementById("btn0"); //調用上面寫的封裝的函數綁定事件 EventUtil.addEvent(btn0, "click", showMsg);4.總結
主要是回顧了一下DOM事件,后面又做了兩個小練習
1.封裝事件處理
2.event事件對象
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/112306.html
摘要:組件事件響應在構建虛擬的同時,還構建了自己的事件系統且所有事件對象和規范保持一致。的事件系統和瀏覽器事件系統相比,主要增加了兩個特性事件代理和事件自動綁定。 React組件事件響應 React在構建虛擬DOM的同時,還構建了自己的事件系統;且所有事件對象和W3C規范保持一致。 React的事件系統和瀏覽器事件系統相比,主要增加了兩個特性:事件代理、和事件自動綁定。 1、事件代理 ...
摘要:取消事件的默認行為。阻止事件的派發包括了捕獲和冒泡阻止同一個事件的其他監聽函數被調用。 事件模型 DOM0 級事件模型 -沒有事件流,這種方式兼容所有瀏覽器 // 方式一 將事件直接通過屬性綁定在元素上 / 方式二 獲取到頁面元素后,通過 onclick 等事件,將觸發的方法指定為元素的事件 var btn = document.getElementById(btn) btn....
摘要:指定事件處理程序指定事件處理程序主要有兩種方式級事件處理程序級事件處理程序。添加事件處理程序注意這里是哦或移除事件處理程序使用移除事件處理程序的條件與方法相同必須提供相同的參數,從而添加的匿名函數也無法被移除。 今天看書又看到事件,遂決定小總結一下~ JavaScript與HTML之間的交互是通過事件實現的。事件,就是文檔或瀏覽器窗口中發生的一些特定的交互瞬間。可以使用監聽器(事件處...
閱讀 1830·2021-11-11 16:54
閱讀 2055·2019-08-30 15:56
閱讀 2365·2019-08-30 15:44
閱讀 1281·2019-08-30 15:43
閱讀 1856·2019-08-30 11:07
閱讀 812·2019-08-29 17:11
閱讀 1464·2019-08-29 15:23
閱讀 3007·2019-08-29 13:01