首頁 > 開發者 > JavaScript
js事件驅動機制 瀏覽器安全色處理方法，js處理方法
3.1. 事件是如何產生的 *
第一種情況，使用者對網頁做了某些操作，比如，點擊了一個按鈕，產生點擊事件。 第二種情況，使用者沒有對網頁做操作，也可能產生事件，比如瀏覽器已經將整個頁面載入完畢，會產生載入完成事件。當事件產生以後，瀏覽器會尋找產生事件的節點有沒有綁訂相應的事件處理代碼。如果有，則調用該代碼來處理。如果沒有，會繼續向上尋找父節點，有沒有對應的事件處理代碼(事件冒泡)。
3.2. 綁訂事件處理代碼 **
1) 綁訂事件處理代碼到html標記乊上
比如: <a id="a1" href="" onclick="f1();">click</a>
2) 綁訂事件處理代碼到dom節點之上
var obj = document.getElementById('a1'); obj.onclick=f1;
注意：
a. f1不要加"()",加"()"表示立即執行f1這個氹數。
b. 可以使用匿名氹數迚行綁訂。
即： obj.onclick=function(){ //代碼。 }
c. 綁訂事件處理代碼到dom節點之上，可以將js代碼不html完全分離，方便代碼的維護。
d. 如果要給綁訂的氹數傳參。可以使用匿名氹數來解決。
即: obj.onclick=function(){ f(參數); }
3) 使用瀏覽器內建的綁訂方式（瞭解）
不同的瀏覽器，有各自專屬的綁訂方式，因為丌相容，所以盡量少用。
Script指令碼可以在<body>中寫
等價於
如果傳參數怎麼辦？使用匿名氹數
【案例3.1】綁訂事件處理代碼到html標記之上 **
3.3. 事件對象 ***
1) 獲得事件對象
IE瀏覽器: 可以直接使用event獲得
firefox: 必須給方法添加一個參數event
一般為了相容ie,firefox，給方法添加一個參數event
2) 事件對象的作用
a. 獲得滑鼠點擊的座標
event.clientX event.clientY
b. 獲得事件來源(產生事件的那個對象)
firefox: event.target獲得 IE瀏覽器: event.srcElement獲得
3.4. 事件冒泡 **
1) 什麼是事件冒泡？當一個節點產生事件以後，該事件會依次向上傳遞(先傳給父節點，如果父節點還有父節點， 再向上傳遞)。
2) 如何禁止冒泡? event.cancelBubble = true;
2) “事件冒泡”現象關閉對話方塊“你點擊了一個連結”，繼續彈出對話方塊“你點擊了一個div”
【案例3.4】事件對象 **
<html>
<!--事件對象-->
------------------------------------------------------------------------------------------------------
js是採用事件驅動(event-driven)響應使用者操作的。
比如通過滑鼠或者按鍵在瀏覽器視窗或者網頁元素(按鈕,文字框...)上執行的操作,我們稱之為事件(Event)。
由滑鼠或熱鍵引發的一連串程式的動作,稱之為事件驅動 (Event-Driver)。
對事件進行處理常式或函數，我們稱之為事件處理常式 (Event Handler)。
----------------------------------------------------------------------------------------------------------------------
瀏覽器安全色處理
<script language="javascript"><!-- if(window.XMLHttpRequest){ //Mozilla, Safari, IE7,IE8 if(!window.ActiveXObject){ // Mozilla, Safari, alert('Mozilla, Safari'); }else{ alert('IE7 .8'); } }else { alert('IE6'); } //--></script>
-------------------------------------------------------------------------------待續
一個事件，需要多個方法，可以用，隔開就可以了
<input type="button" value="red" onclick="mychange(this),sayHello()"/>
<body onkeydown="showkey(event)" onload="abc()" onunload="abc2()">
以上這篇js事件驅動機制 瀏覽器安全色處理方法就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支援幫客之家。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
