1、鼠標事件：

onclick 左鍵單擊 ondblclick 左鍵雙擊 onmouseover onmouseenter 鼠標移入 onmouseout onmouseleave鼠標移出 onmousedown 鼠標按下 onmousmove 鼠標移動（鼠標滑動） onmouseup 鼠標抬起 oncontextmenu 右鍵單擊(右鍵菜單)

 2、鍵盤事件：

onkeydown onkeypress 鍵按下 onkeyup 鍵抬起 鍵盤事件必須放在整個文檔（document）里面去操作，不能放在節(jié)點里面去操作

3、系統(tǒng)事件：

onload 加載完成后 onerror 加載出錯后 onresize 窗口調(diào)整大小時 onscroll 滾動時

    


        


            


            

        

        


            

                //onload 加載完成后 onerror 加載出錯后 onresize 窗口調(diào)整大小時   都是放在window的身上
            

        

    

    


        


            


            

        

        


            

                window.onload = function(){};
            

        

    

    


        


            


            

        

        


            


            

        

    

    


        


            


            

        

        


            

                //onscroll 滾動時  可以放在document和window身上
            

        

    

    


        


            


            

        

        


            

                document.onscroll = function(){};
            

        

    

 4、表單事件：

onfocus 獲取焦點后 onblur 失去焦點后 onchange 改變內(nèi)容后 onreset 重置后 onselect 選擇后 onsubmit 提交后

5、監(jiān)聽事件(綁定事件)寫法：

節(jié)點.事件 = 函數(shù)。

document.getElementById("main").onclick = function(){alert(1)};

document.getElementById("main").addEventListener("click",function(){},false);

行內(nèi)綁定

<button οnclick="alert('hello world')">Click</button>

 <button οnclick="func()">Click</button>

<script type="text/javascript">

          var func = () => {

                    alert('hello world')

          };

</script>

6、事件函數(shù)this指向：在事件函數(shù)中，關鍵詞 this 就表示觸發(fā)事件的這個節(jié)點對象。

 7、修改this指向：

call() 第一個參數(shù)為 函數(shù)this將要修改指向的對象 函數(shù)有參數(shù)時 后面, 一一跟上即可 可以主動執(zhí)行函數(shù)

apply() 第一個參數(shù)為 函數(shù)this將要修改指向的對象 函數(shù)有參數(shù)時 數(shù)組包一下 可以主動執(zhí)行函數(shù)

bind() 第一個參數(shù)為 函數(shù)this將要修改指向的對象 函數(shù)有參數(shù)時 后面, 一一跟上即可 不不不會主動執(zhí)行函數(shù) 但會return函數(shù)本體 再加一個括號即可執(zhí)行  

    


        


            


            

        

        


            

                window.a = 0 //在window對象下創(chuàng)建一個屬性，屬性值為0
            

        

    

    


        


            


            

        

        


            


            

        

    

    


        


            


            

        

        


            

                let obj1 = {
            

        

    

    


        


            


            

        

        


            

                a: 1
            

        

    

    


        


            


            

        

        


            

                }
            

        

    

    


        


            


            

        

        


            

                let obj2 = {
            

        

    

    


        


            


            

        

        


            

                a: 2
            

        

    

    


        


            


            

        

        


            

                }
            

        

    

    


        


            


            

        

        


            


            

        

    

    


        


            


            

        

        


            

                function fn(num1, num2, num3) {
            

        

    

    


        


            


            

        

        


            

                console.log(this.a);
            

        

    

    


        


            


            

        

        


            

                console.log(num1, num2, num3);
            

        

    

    


        


            


            

        

        


            

                }
            

        

    

    


        


            


            

        

        


            


            

        

    

    


        


            


            

        

        


            

                //修改函數(shù)里面this的指向
            

        

    

    


        


            


            

        

        


            

                fn.call(obj1,4,5,6)
            

        

    

    


        


            


            

        

        


            

                fn.apply(obj2,[4,5,6])
            

        

    

    


        


            


            

        

        


            

                fn.bind(obj1,4,5,6)()
            

        

    

藍藍設計建立了UI設計分享群，每天會分享國內(nèi)外的一些優(yōu)秀設計，如果有興趣的話，可以進入一起成長學習，請掃碼藍小助，報下信息，藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作，也請與我們聯(lián)系。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.

轉自：csdn
免責聲明：藍藍設計尊重原作者，文章的版權歸原作者。如涉及版權問題，請及時與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍藍設計( www.shtzxx.cn )是一家專注而深入的界面設計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務