![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>文档事件</title> 6 <!-- 代码自身至下解析 --> 7 <script type="text/javascript"> 8 var div = document.querySelector('div'); 9 console.log(div); // null 10 </script> 11 <script type="text/javascript"> 12 // 文档加载完毕,触发 13 window.onload = function () { 14 var div = document.querySelector('div'); 15 console.log(div); 16 } 17 </script> 18 </head> 19 <body> 20 <div class="div"></div> 21 </body> 22 <script type="text/javascript"> 23 window.onbeforeunload = function () { 24 return false; 25 } 26 </script> 27 </html>
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>图片事件</title> 6 </head> 7 <body> 8 <img src="img/001.png" alt=""> 9 </body> 10 <script type="text/javascript"> 11 var img = document.querySelector('img'); 12 img.onerror = function () { 13 console.log("图片加载失败了"); 14 } 15 </script> 16 </html>
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>页面事件</title> 6 <script type="text/javascript"> 7 window.onload = function () { 8 window.onscroll = function () { 9 console.log(window.scrollY); 10 } 11 window.onresize = function () { 12 console.log(window); 13 } 14 15 } 16 </script> 17 </head> 18 <body> 19 <br> 20 <br> 21 <br> 22 <br> 23 <br> 24 <br> 25 <br> 26 <br> 27 <br> 28 <br> 29 <br> 30 <br> 31 <br> 32 <br> 33 <br> 34 <br> 35 <br> 36 <br> 37 <br> 38 <br> 39 <br> 40 <br> 41 <br> 42 <br> 43 <br> 44 <br> 45 <br> 46 <br> 47 <br> 48 <br> 49 <br> 50 <br> 51 <br> 52 <br> 53 <br> 54 <br> 55 <br> 56 <br> 57 <br> 58 <br> 59 <br> 60 <br> 61 <br> 62 <br> 63 <br> 64 <br> 65 <br> 66 <br> 67 <br> 68 <br> 69 <br> 70 <br> 71 <br> 72 <br> 73 <br> 74 <br> 75 <br> 76 <br> 77 <br> 78 <br> 79 <br> 80 <br> 81 <br> 82 <br> 83 <br> 84 <br> 85 <br> 86 <br> 87 <br> 88 <br> 89 <br> 90 <br> 91 <br> 92 <br> 93 <br> 94 <br> 95 <br> 96 <br> 97 <br> 98 <br> 99 <br> 100 <br> 101 <br> 102 <br> 103 <br> 104 <br> 105 <br> 106 <br> 107 <br> 108 <br> 109 <br> 110 <br> 111 <br> 112 <br> 113 <br> 114 <br> 115 <br> 116 <br> 117 <br> 118 <br> 119 </body> 120 </html>