原生js中的事件監聽方法

2021-08-22 08:26:39 字數 913 閱讀 3895

好久沒有使用過原生js中的監聽方法,竟然發現有些陌生,幾個方法之間的區別也有些混亂了。不過看過了api文件,又將他們之間的區別和用法理清楚了,這裡進行總結。

一、傳統事件繫結方法
window.onload=function

()document.getelementbyid("btn").onclick=function

()document.onmousemove=function

()

二、addeventlistener()
window.addeventlistener('load',init,false);

function

init

()// 下面寫法與上面等價

// 向 元素新增事件控制代碼

document.getelementbyid("mydiv").addeventlistener("mousemove", myfunction);

// 移除 元素的事件控制代碼

document.getelementbyid("mydiv").removeeventlistener("mousemove", myfunction);

三、attachevent()
window.attachevent('onload',function

());

四、總結

原生js的監聽滾輪事件

前言 只要是現在做網頁開發的大部分在右側都會有乙個置頂按鈕,而這個置頂按鈕有的是一開始就會一直顯示,有的則是滾輪向下滾動一定距離之後,才會顯示,一直顯示的不講,這個簡單,這裡就對滾輪進行一下筆記記錄 監聽滾輪滾動事件 window.onscroll function if scrollt scrol...

Vue中如何監聽元件的原生事件

在首頁開發中,右下角有乙個返回頂部的小箭頭,將它單獨封裝成乙個backtop元件,但是它何時出現需要依賴於首頁的滑動,即另外乙個scroll元件。如果直接在backtop元件裡面監聽,則需要通過this.emit將事件發射到home元件中,又在home中監聽自定義事件,比較複雜。因此,我們直接在ho...

快速上手原生js中的事件

我們在學習的時候,最初接觸的事件繫結方式大多是傳統事件繫結方法。傳統事件繫結方法事例如下 window.nl ad function document.getelementbyid btn nclick function document.nm usem ve function 1234 5678 ...