zoukankan      html  css  js  c++  java
  • 文档事件、图片事件和页面滚动事件

     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>
    文档事件
     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>
    图片事件
      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>
    页面滚动事件
  • 相关阅读:
    java实现第八届蓝桥杯数位和
    java实现第八届蓝桥杯数位和
    java实现第八届蓝桥杯数位和
    java实现第八届蓝桥杯数位和
    java实现第八届蓝桥杯数位和
    java实现第九届蓝桥杯三角形面积
    java实现第九届蓝桥杯三角形面积
    java实现第九届蓝桥杯三角形面积
    JAVA中this的三种用法的详解
    JSON字符串转换为Map
  • 原文地址:https://www.cnblogs.com/xuqidong/p/12113365.html
Copyright © 2011-2022 走看看