第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定

jQuery學(xué)習(xí)---------認(rèn)識(shí)事件處理

標(biāo)簽:
JQuery

3种事件模型:

   原始事件模型

   DOM事件模型

   IE事件模型


原始事件模型(0级事件模型)

    1、事件处理程序被定义为函数实例,然后绑定到DOM元素事件对象上,实现事件的注册。


       例子:var btn = document.getElementsByTagName("input")[0];

             btn.onclick = function(){

               函数体....

             }

    2、也可以把特定的事件处理函数的函数体直接赋给DOM元素的事件属性


       例子:<input type="button" onclick="alert('hello')"

    

    0级事件模型的优缺点:

       优点:使用方便

       缺点:元素属性被用来存储事件处理函数的引用,

             所以每个元素的每个事件只能注册一个事件处理程序。


DOM事件模型:

    1、注册事件

       addEventListener()方法:

         语法:addEventListener("type",function,useCapture)

         参数:type:是要绑定的事件类型,但是这里没有“on”前缀。

                     如onclick事件应写作:click

               function:事件处理函数,自带一个默认参数,引用event对象

               usrCapture:是一个布尔值,

                           为true时:在事件传播的捕捉阶段触发响应;

                           为false时:在事件传播的冒泡阶段触发响应

     

        例子:var btn = document.getElementsByTagName("input")[0];

      btn.addEventListener("click",function(){

     btn.value = event.type;

          },true)

    

     2、事件传播

        DOM 2级事件模型中,一旦事件被触发,事件流首先从DOM树的顶部(文档节点#document)向下传播,直到目标节点,然后再从目标节点向上传播到DOM树顶。

        从上到下的过程被称为捕获阶段,

        从下到上的过程被称为冒泡阶段。

        终止事件流的冒泡:stopPropagegation()方法


        例子:var btn = document.getElementsByTagName("input")[0];

        do{

  btn.addEventListener("click",function(){

  div.innerHTML += " "+this.nodeName+" ";

  },true)

  btn = btn.parentNode;

  }while(btn);

             

             上例中,第三个参数设置为true,注册的是捕获型事件。

                     所以点击按钮,事件触发顺序为:#document->html->body->button

               如果,第三个参数设置为false,注册的是冒泡型事件。

                     所以点击按钮,事件的触发顺序为:button->body->html->#document


    3、销毁事件

           removeEventListener()方法:

           注意:removeEventListener()和addEventListener()的第三个参数要保持一致

                 否则销毁操作是无效的。


IE事件模型:

    1、注册事件:

           attachEvent()方法:

              语法:attachEvent("type",function)

              参数:type:元素事件类型,如:onclick

                    function:事件处理函数

       注意:IE时间模型中,事件处理函数中的this指针总是指向window对象,

             0型事件模型中,事件处理函数中的this指针总是指向当前注册事件的对象

   2、事件传播:

          IE事件模型:事件流总是从目标对象向上传递知道树顶,即冒泡型。

          终止事件流的冒泡:设置event对象的cancelBubble属性


   3、注销事件:

          detachEvent()方法


事件处理机制:

    Event对象:

       当触发事件时,浏览器会自动创建一个event对象,

                     event对象实际上是Event类型的实例,

                     默认状态下他会被作为参数传递给事件处理函数


       实现访问的兼容性:

           var event = event||window.event;


       注意:IE和DOM标准浏览器返回的event对象的属性和方法存在差异!!!


點(diǎn)擊查看更多內(nèi)容
TA 點(diǎn)贊

若覺(jué)得本文不錯(cuò),就分享一下吧!

評(píng)論

作者其他優(yōu)質(zhì)文章

正在加載中
  • 推薦
  • 評(píng)論
  • 收藏
  • 共同學(xué)習(xí),寫下你的評(píng)論
感謝您的支持,我會(huì)繼續(xù)努力的~
掃碼打賞,你說(shuō)多少就多少
贊賞金額會(huì)直接到老師賬戶
支付方式
打開(kāi)微信掃一掃,即可進(jìn)行掃碼打賞哦
今天注冊(cè)有機(jī)會(huì)得

100積分直接送

付費(fèi)專欄免費(fèi)學(xué)

大額優(yōu)惠券免費(fèi)領(lǐng)

立即參與 放棄機(jī)會(huì)
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)

舉報(bào)

0/150
提交
取消