10
0

6_DOM事件绑定.html 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Document</title>
  7. </head>
  8. <body>
  9. <h1>hello</h1>
  10. <h1>world</h1>
  11. <script>
  12. var oH1 = document.getElementsByTagName("h1");
  13. // 鼠标点击事件(单击)
  14. oH1[0].onclick = function(){
  15. // console.log("hello world")
  16. // oH1[0].innerText = "你好";
  17. this.innerText = "hello world";
  18. }
  19. // 鼠标右键
  20. var oBody = document.getElementsByTagName("body")[0];
  21. oBody.oncontextmenu = function(){
  22. console.log("hello");
  23. // return false 在事件处理函数当中可以阻止浏览器的默认行为
  24. return false;
  25. }
  26. // 鼠标滑入
  27. // 鼠标移入滑动时频繁触发
  28. // oH1[1].onmousemove = function(){
  29. // console.log("mouseover")
  30. // }
  31. // 鼠标移入仅触发一次
  32. // oH1[1].onmouseenter = function(){
  33. // console.log("mouseenter")
  34. // }
  35. // 鼠标移出
  36. oH1[1].onmouseleave = function(){
  37. }
  38. </script>
  39. </body>
  40. </html>