onload 事件

事件对象参考手册 事件对象

当页面载入完毕后执行JavaScript代码:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>蜜蜂教程(mifengjc.com)</title>
  <script>
    function myFunction() {
      alert("页面加载完成");
    }
  </script>
</head>

<body onload="myFunction()">
  <h1>Hello World!</h1>
</body>

</html>

尝试一下 »


定义和用法

onload 事件会在页面或图像加载完成后立即发生。

onload 通常用于 <body> 元素,在页面完全载入后(包括图片、css文件等等。)执行脚本代码。

语法

在 HTML 中:

<body onload="SomeJavaScriptCode">

在 JavaScript 中:

window.onload = function() {
  SomeJavaScriptCode
};

参数 描述
SomeJavaScriptCode 必需。规定该事件发生时执行的 JavaScript。

浏览器支持

Internet ExplorerFirefoxOperaGoogle ChromeSafari

所有主要浏览器都支持 onload 事件


以下 HTML 标签支持 onload :

<body>,
  <frame>,
    <frameset>, <iframe>, <img>, <input type="image">,
<link>, <script>, <style>

更多实例

在 <img> 使用onload - 图片载入后立即弹出 "Image is loaded"

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>蜜蜂教程(mifengjc.com)</title>
  <script>
    function loadImage() {
      alert("图片加载完成");
    }
  </script>
</head>
<body>

  <img src="/examples/logo.png" onload="loadImage()" width="336" height="36">

</body>
</html>

尝试一下 »


事件对象参考手册 事件对象