JavaScript HTML DOM onload 事件

  • onload 事件

    加载对象时发生onload事件。onload通常在<body>元素中用于在网页完全加载所有内容(包括图像,脚本文件,CSS文件等)后执行脚本。onload事件可用于检查访问者的浏览器类型和浏览器版本,并根据信息加载正确版本的网页。onload事件也可用于处理cookie(参见下面的“更多示例”)。
    加载页面后立即执行JavaScript:
    <body onload="myFunction()">
    
    尝试一下
  • 浏览器支持

    IE/Edge Chrome FireFox Safari Opera
    事件
    onload
    支持
    支持
    支持
    支持
    支持
  • 语法

    在HTML中:
    <element onload="myScript">
    在JavaScript中:
    object.onload = function(){myScript};
    在JavaScript中,使用addEventListener()方法:
    object.addEventListener("load", myScript);
    注意:在Internet Explorer 8和更早版本不支持使用addEventListener()方法。
  • 技术细节

    项目 描述
    冒泡: 没有
    取消: 没有
    事件类型: 如果从用户界面生成则为UiEvent,否则为Event
    支持的HTML标记: <body><frame><iframe><img><input type =“image”><link><script><style>
    DOM版本 DOM Event Level 2
  • 更多例子

    在<img>元素上使用onload。加载图像后立即警告“图像已加载”:
    <img src="w3javascript.gif" onload="loadImage()" width="100" height="132">
    
    <script>
    function loadImage() {
      alert("Image is loaded");
    }
    </script>
    
    尝试一下
    使用onload事件处理cookie:
    <body onload="checkCookies()">
    
    <script>
    function checkCookies() {
      var text = "";
    
      if (navigator.cookieEnabled == true) {
        text = "Cookies are enabled.";
      } else {
         text = "Cookies are not enabled.";
      }
      document.getElementById("demo").innerHTML = text;
    }
    </script>
    
    尝试一下
  • 相关页面

    JavaScript参考 : HTML onload 属性