JS---DOM---總結綁定事件的區別

来源:https://www.cnblogs.com/jane-panyiyun/archive/2019/12/10/12016700.html
-Advertisement-
Play Games

總結綁定事件的區別: addEventListener(); attachEvent() 相同點: 都可以為元素綁定事件 不同點: 1.方法名不一樣 2.參數個數不一樣addEventListener三個參數,attachEvent兩個參數 3.addEventListener 谷歌,火狐,IE11 ...


總結綁定事件的區別:

addEventListener(); attachEvent()   相同點: 都可以為元素綁定事件 不同點:

1.方法名不一樣

2.參數個數不一樣addEventListener三個參數,attachEvent兩個參數

3.addEventListener 谷歌,火狐,IE11支持,IE8不支持

   attachEvent 谷歌火狐不支持,IE11不支持,IE8支持

 

4.this不同, addEventListener 中的this是當前綁定事件的對象

   attachEvent中的this是window

    //為按鈕綁定多個點擊事件

    my$("btn").addEventListener("click", function () {
      console.log(this);
    }, false);

    my$("btn").attachEvent("onclick", function () {
      console.log(this);
    });

 

5.addEventListener中事件的類型(事件的名字)沒有on

   attachEvent中的事件的類型(事件的名字)有on

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 解決z-index上層元素遮擋下層元素點擊事件問題 by:授客 QQ:1033553122 開發環境 Win 10 element-ui "2.8.2" Vue 2.9.6 需求描述 如下,有以下界面,其中右側邊時一個ElementUI Dialog模態對話框,希望在對話框上執行點擊操作時,不會點擊 ...
  • 基於HTML5 canvas 獲取文本占用的像素寬度 by:授客 QQ:1033553122 直接上代碼 // 獲取單行文本的像素寬度 getTextPixelWith(text, fontStyle) { var canvas = document.createElement("canvas"); ...
  • 引言 在開發中台過程中 我們的原型中有很多表單,antd有表單組件,但是粒度比較細,就單純組件而言,無可厚非,但是在開發過程中,可能會造成代碼不夠聚合,有些表單公共邏輯無法提取,copy paste比較多,所以可以加以封裝,搞一個相容性和擴展性都契合項目本身的組件。 主要思路 我簡單查閱了一番資料, ...
  • 1:利用DOM獲取該 div 的 ID,然後清空該DIV的內容(如果你需要接著裡面的內容添加可不要清空);需要註意點是清空最好用“ empty() ”; 2: 把 async設成true ,否則又一條警告的錯誤,這條錯誤導致你的內容顯示不出來;下麵就是警告的錯誤 3:就是添加HTML了。 具體代碼如 ...
  • 註:本文非本人原著;原文作者: 黃卉 《js去除空格12種方法》 ...
  • css3 實現右箭頭→ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <style> .divtest{ position: absolute; top: ...
  • 1. 綁定事件的相容 function addEventListener(element,type,fn) { if(element.addEventListener){ element.addEventListener(type,fn,false); }else if(element.attach ...
  • 解綁事件 註意:用什麼方式綁定事件, 就應該用對應的方式解綁事件 1.解綁事件 對象.on事件名字=事件處理函數 >綁定事件 對象.on事件名字=null; //1 對象.on事件名字=事件處理函數 綁定事件 my$("btn").onclick = function () { console.lo ...
一周排行
    -Advertisement-
    Play Games
  • 概述:本文代碼示例演示瞭如何在WPF中使用LiveCharts庫創建動態條形圖。通過創建數據模型、ViewModel和在XAML中使用`CartesianChart`控制項,你可以輕鬆實現圖表的數據綁定和動態更新。我將通過清晰的步驟指南包括詳細的中文註釋,幫助你快速理解並應用這一功能。 先上效果: 在 ...
  • openGauss(GaussDB ) openGauss是一款全面友好開放,攜手伙伴共同打造的企業級開源關係型資料庫。openGauss採用木蘭寬鬆許可證v2發行,提供面向多核架構的極致性能、全鏈路的業務、數據安全、基於AI的調優和高效運維的能力。openGauss深度融合華為在資料庫領域多年的研 ...
  • openGauss(GaussDB ) openGauss是一款全面友好開放,攜手伙伴共同打造的企業級開源關係型資料庫。openGauss採用木蘭寬鬆許可證v2發行,提供面向多核架構的極致性能、全鏈路的業務、數據安全、基於AI的調優和高效運維的能力。openGauss深度融合華為在資料庫領域多年的研 ...
  • 概述:本示例演示了在WPF應用程式中實現多語言支持的詳細步驟。通過資源字典和數據綁定,以及使用語言管理器類,應用程式能夠在運行時動態切換語言。這種方法使得多語言支持更加靈活,便於維護,同時提供清晰的代碼結構。 在WPF中實現多語言的一種常見方法是使用資源字典和數據綁定。以下是一個詳細的步驟和示例源代 ...
  • 描述(做一個簡單的記錄): 事件(event)的本質是一個委托;(聲明一個事件: public event TestDelegate eventTest;) 委托(delegate)可以理解為一個符合某種簽名的方法類型;比如:TestDelegate委托的返回數據類型為string,參數為 int和 ...
  • 1、AOT適合場景 Aot適合工具類型的項目使用,優點禁止反編 ,第一次啟動快,業務型項目或者反射多的項目不適合用AOT AOT更新記錄: 實實在在經過實踐的AOT ORM 5.1.4.117 +支持AOT 5.1.4.123 +支持CodeFirst和非同步方法 5.1.4.129-preview1 ...
  • 總說周知,UWP 是運行在沙盒裡面的,所有許可權都有嚴格限制,和沙盒外交互也需要特殊的通道,所以從根本杜絕了 UWP 毒瘤的存在。但是實際上 UWP 只是一個應用模型,本身是沒有什麼許可權管理的,許可權管理全靠 App Container 沙盒控制,如果我們脫離了這個沙盒,UWP 就會放飛自我了。那麼有沒... ...
  • 目錄條款17:讓介面容易被正確使用,不易被誤用(Make interfaces easy to use correctly and hard to use incorrectly)限制類型和值規定能做和不能做的事提供行為一致的介面條款19:設計class猶如設計type(Treat class de ...
  • title: 從零開始:Django項目的創建與配置指南 date: 2024/5/2 18:29:33 updated: 2024/5/2 18:29:33 categories: 後端開發 tags: Django WebDev Python ORM Security Deployment Op ...
  • 1、BOM對象 BOM:Broswer object model,即瀏覽器提供我們開發者在javascript用於操作瀏覽器的對象。 1.1、window對象 視窗方法 // BOM Browser object model 瀏覽器對象模型 // js中最大的一個對象.整個瀏覽器視窗出現的所有東西都 ...