绑住美女视频,1000部美女视频

首先是最常規(guī)的方法：

程序代碼

<p id="para" title="cssrain demo!" onclick="test()" >test</p>
<script>
function test(){
alert("test");
}
</script>

當某一天，我們知道JavaScript要跟HTML結(jié)構(gòu)實現(xiàn)分離后，就會改了一種寫法:

程序代碼

<p id="para" title="cssrain demo!">test</p>
<script>
function test(){
alert("test");
}
window.onload = function(){
document.getElementById("para").onclick = test;
}
</script>

當我們工作越來越久后，有時候我們需要對某個元素綁定多個相同的事件類型：

程序代碼

<p id="para" title="cssrain demo!">test</p>
<script>
function test(){
  alert("test");
}

function pig(){
  alert("pig");
}

window.onload = function(){
     document.getElementById("para").onclick = test;
     document.getElementById("para").onclick = pig;
}
</script>

如果按照上面的寫法，我們只能輸出第二個函數(shù)。
這時候我們需要用到attachEvent方法:

程序代碼

<p id="para" title="cssrain demo!">test</p>
<script>
function test(){
  alert("test");
}

function pig(){
  alert("pig");
}

window.onload = function(){
     document.getElementById("para").attachEvent("onclick",test);
     document.getElementById("para").attachEvent("onclick",pig);
}
</script>

在一段時間內(nèi)，你并沒發(fā)現(xiàn)這段代碼有任何錯誤。
某一天，一個名叫firefox的瀏覽器闖入你的視野，當我們把這段代碼放到firefox中執(zhí)行后，
發(fā)現(xiàn)并不能正常運行。問題就這樣，越來越多，然而作為一名JS程序員，這些都是必須面對的。

為了解決這段代碼的平臺兼容性問題，我翻翻手冊，知道了firefox跟ie的區(qū)別：
firefox中注冊事件使用：addEventListener方法，同時為了兼容ie，我們必須用到if ... else...

程序代碼

<p id="para" title="cssrain demo!">test</p>
<script>
function test(){
  alert("test");
}

function pig(){
  alert("pig");
}

window.onload = function(){
         var element =  document.getElementById("para");
         if(element.addEventListener){  // firefox  , w3c
                element.addEventListener("click",test,false);
    element.addEventListener("click",pig,false);
         } else {   // ie
    element.attachEvent("onclick",test);
    element.attachEvent("onclick",pig);
         }
}
</script>

此時，代碼就可以在多個平臺上工作了。

但隨著水平的進步，你不滿足每次都去判斷，你想把這個判斷封裝起來，以后可以直接調(diào)用：

程序代碼

<p id="para" title="cssrain demo!">test</p>
<script>
function test(){
  alert("test");
}

function pig(){
  alert("pig");
}

function addListener(element,e,fn){
     if(element.addEventListener){
          element.addEventListener(e,fn,false);
     } else {
          element.attachEvent("on" + e,fn);
     }
}

window.onload = function(){
         var element =  document.getElementById("para");
         addListener(element,"click",test);
         addListener(element,"click",pig);
}
</script>

至此，作為一個程序員的工作就完了。
中間我們從一個最傳統(tǒng)，最基本的寫法，然后實現(xiàn)Js和HTML的分離，然后又實現(xiàn)對同一個元素注冊多個事件，期間，我們發(fā)現(xiàn)注冊事件的兼容性問題。最后我們對注冊事件的方法進行封裝，方便以后使用。

好了，文章寫到這里。希望大家有收獲哦。。。

原文屬于cssrain.cn原創(chuàng)，轉(zhuǎn)載請注明。

本站僅提供存儲服務，所有內(nèi)容均由用戶發(fā)布，如發(fā)現(xiàn)有害或侵權內(nèi)容，請點擊舉報。

国产一级a片免费看高清,亚洲熟女中文字幕在线视频,黄三级高清在线播放,免费黄色视频在线看