19_this指向.html 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>Document</title>
  8. <style>
  9. #div1{
  10. width: 200px;
  11. height: 200px;
  12. background: aqua
  13. }
  14. </style>
  15. </head>
  16. <body>
  17. <div id="div1"></div>
  18. <script>
  19. var div1 = document.getElementById('div1')
  20. //1.当前对象引用中 谁的事件 this就指向谁
  21. // div1.onclick = function(){
  22. // console.log(this)
  23. // }
  24. //2.在定时器中 this->window
  25. // var timer = setInterval(function(){
  26. // console.log(this)
  27. // },1000)
  28. // div1.onclick = function(){
  29. // var timer = setInterval(function(){
  30. // console.log(this)
  31. // },1000)
  32. // }
  33. //3.对象下面 this->对象本身
  34. // var person = {
  35. // name: 'zs',
  36. // age: 18,
  37. // eat: function(){
  38. // console.log(this)
  39. // }
  40. // }
  41. // person.eat()
  42. //4.方法里面 this->window
  43. function xx(){
  44. console.log(this)
  45. }
  46. xx()
  47. </script>
  48. </body>
  49. </html>