onload 事件
定义和用法
onload 事件在对象被加载后发生。
onload 最常用于 <body> 元素中,用于在网页完全加载所有内容(包括图像、脚本文件、CSS 文件等)后执行脚本。
onload 事件可用于检查访问者的浏览器类型和浏览器版本,并根据这些信息加载网页的正确版本。
onload 事件也可用于处理 cookie (请参阅下面的更多实例).
浏览器支持
事件 | Chrome | IE | 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 版本: | Level 2 Events |
更多实例
实例
在 <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>