2.this指向.html 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  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. <style>
  8. #box {
  9. width: 200px;
  10. height: 200px;
  11. background-color: #f00;
  12. }
  13. </style>
  14. </head>
  15. <body>
  16. <div id="box"></div>
  17. <script>
  18. var box = document.getElementById("box");
  19. // 1.点击事件 this指向该对象
  20. // box.onclick = function() {
  21. // console.log(this)
  22. // }
  23. // 2.定时器 this指向window
  24. // setTimeout(()=> {
  25. // console.log(this)
  26. // },2000)
  27. // box.onclick = function () {
  28. // setTimeout(() => {
  29. // console.log(this)
  30. // }, 2000)
  31. // }
  32. // setInterval(定时器) / setTimeout(延时器)
  33. // 3.对象中 普通函数 调用本身;箭头函数调用 上下级
  34. // let obj = {
  35. // name:"图图",
  36. // age:3,
  37. // address:function() {
  38. // console.log(this,'语音')
  39. // }
  40. // }
  41. // obj.address();
  42. // 4.普通函数 this指向window
  43. function fn() {
  44. console.log(this)
  45. }
  46. fn()
  47. </script>
  48. </body>
  49. </html>