鼠标事件

91 阅读1分钟
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
     <button>按钮</button>
     <button>按钮1</button>
     <script>
         var bt1=document.getElementsByTagName("button")[0];
         var bt2=document.getElementsByTagName("button")[1];

        //  点击事件
         bt1.onclick=function(){
             console.log("点击事件")
         }

        //  鼠标进入事件
        bt1.onmouseenter=function(){
            console.log("鼠标进入事件");
        }

        // 鼠标移出事件
        bt1.onmouseleave=function(){
            console.log("鼠标移出事件");
        }
        // 鼠标按下事件
        bt2.onmousedown=function(){
            console.log("鼠标按下事件");
        }

        // 鼠标抬起事件
        bt2.onmouseup=function(){
            console.log("鼠标抬起事件");
        }

        // 鼠标移动事件
        bt2.onmousemove=function(){
            console.log("鼠标移动事件");
        }

        // 鼠标双击事件
        bt2.ondblclick=function(){
            console.log("鼠标双击事件");
        }
     </script>
</body>
</html>