<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>事件类型(鼠标事件)</title> <!-- -onsubmit;表单中的确认按钮被点击后触发 -onsubmit:表单中的确认按钮被点击时发生 -onmousedown:鼠标按钮在元素上按下时触发 -onmousemove:在鼠标指针移动时发生 -onmouseup:在元素上松开鼠标按钮时触发 -onresize:当调整浏览器窗口的大小时触发 -onscroll:拖动滚动条滚动时触发 --> <style> div{ width: 100px; height: 100px; background: black; } body{ height: 2000px; } </style> </head> <body> <div></div> <script> var x=document.getElementsByTagName("div")[0]; console.log(x); //onmousedown;鼠标按下 x.onmousedown=function (){ console.log("我按下了"); } //onmousemove;鼠标移动 x.onmousemove=function (){ console.log("我移动了"); } //onmouseup;鼠标松开 x.onmouseup=function (){ console.log("我松开了"); } //onclick;鼠标点击 x.onclick=function (){ console.log("我点击了") } //onresize;浏览器窗口大小改变 window.onresize=function (){ console.log("浏览器窗口大小变了"); } //onscroll;滚动条滚动 window.onscroll=function (){ console.log("滚动条动了"); } </script> </body> </html>
原文地址:https://www.cnblogs.com/vinson-blog/p/12077520.html
时间: 2024-11-08 21:50:16