①onabort(DOM2):事件发生在用户对图片进行中止加载的操作(支持冒泡,不可以取消,在用户界面上是UIEvent,否则是Event,支持所有html元素,除了那11种)
支持的浏览器型号(ie(Yes));
用法:html中<element οnabοrt="function-name()">
javascript中 object.οnabοrt=function(){...}
javascript中,使用addEventListener方法: object.addEventListener("onabort",myscript);
②onbeforeunload(DOM2): 事件在即将离开当前页面(刷新或关闭)时触发(不支持冒泡,可以取消,事件类型是Event,支持html元素只有<body>)
支持的浏览器型号(chrome(Yes)、ie(Yes)、ff(Yes)、safari(Yes)、opera(No));
该事件可用于弹出对话框,提示用户是继续浏览页面还是离开当前页面。
对话框默认的提示信息根据不同的浏览器有所不同,标准的信息类似 "确定要离开此页吗?"。该信息不能删除。但你可以自定义一些消息提示与标准信息一起显示在对话框。
注意: 如果你没有在 <body> 元素上指定 onbeforeunload 事件,则需要在 window 对象上添加事件,并使用 returnValue属性创建自定义信息(查看以下语法实例)。如:window.addEventListener("beforeunload", function(event) {
event.returnValue = "我在这写点东西...";
});
window.onbeforeunload = function(event) {
event.returnValue = "我在这写点东西...";
};
注意: 在 Firefox 浏览器中,只显示默认提醒信息(不显示自定义信息)。
③onerror:事件在加载外部文件(文档或图像)发生错误时触发。(不支持冒泡,不可以取消,在用户界面是UIEvent,否则是Event,支持的html标签有<img>、<input type="image">、<object>、<script>、<style>)
支持的所有浏览器型号(所有)
用法:三种,不累述了。。。
④onhashchange:事件在当前URL的锚部分(以‘#’号为开始)发生改变时触发。(支持冒泡,不可以取消,事件类型是Event,支持html元素只有<body>)
支持的浏览器第一个型号:(chrome5.0、ie8.0、ff3.6、Safari5.0、Opera10.6)
用法:三种,不累述了。。。
锚部分的实例:指定当前 URL 为
http://www.example.com/test.htm#part2 - 这个 URL 中的锚部分为#part2。
你可以使用以下方式调用事件:
- 通过设置Location 对象 的 location.hash 或 location.href 属性修改锚部分。
- 使用不同书签导航到当前页面(使用"后退"或"前进"按钮)
- 点击链接跳转到书签锚
⑤onload(DOM2):事件会在页面或图像加载完成后立即发生。
浏览器都支持~
onload 通常用于 <body> 元素,在页面完全载入后(包括图片、css文件等等。)执行脚本代码。
支持onload的标签<body>、<frame>、<frameset>、<iframe>、<img>、<input type="image">、<link>、<script>、<style>
用法:前两种~
⑥onpageshow:事件在用户浏览网页时触发,每次加载网页都被触发(不支持冒泡,不可以取消,事件类型为PageTransitionEvent,支持的标签只有<body>)
支持的浏览器第一个型号:(chrome(Yes)、ie11.0、ff(Yes)、Safari5.0、Opera(Yes))
onpageshow 事件类似于 onload 事件,onload 事件在页面第一次加载时触发,onpageshow 事件在每次加载页面时触发,即 onload 事件在页面从浏览器缓存中读取时不触发。
为了查看页面是直接从服务器上载入还是从缓存中读取,你可以使用 PageTransitionEvent 对象的 persisted 属性来判断。如果页面从浏览器的缓存中读取该属性返回 true,否则返回 false,如:
<body οnpageshοw="myFunction(event)">
function myFunction(event) {
alert("页面是否从浏览器缓存中加载? " + event.persisted);
}
用法:三种,不累述了。。。
⑦onunload(DOM2):事件会在用户退出页面时发生。(如:点击一个链接、提交表单、关闭浏览器等。)(支持的标签有<body>、<frameset>)
支持的浏览器:ie、ff、Safari~
注意:onunload事件同样触发了页面载入事件(+onload事件)
用法: HTML中<body οnunlοad="SomeJavScriptCode">
JavaScript中window.οnunlοad=function(){SomeJavScriptCode}
⑧onpagehide:事件在用户离开网页时触发。(如:点击一个链接、刷新页面、提交表单、关闭浏览器等。)(不支持冒泡,不可以取消,事件类型为PageTransitionEvent,支持的标签只有<body>)
支持的浏览器第一个型号:(chrome(Yes)、ie11.0、ff(Yes)、Safari5.0、Opera(Yes))
onpagehide 事件有时可以替代onunload 事件,但 onunload 事件触发后无法缓存页面。
为了查看页面是直接从服务器上载入还是从缓存中读取,你可以使用 PageTransitionEvent 对象的 persisted 属性来判断。如果页面从浏览器的缓存中读取该属性返回 ture,否则返回 false 。
用法:三种,不累述了。。。⑨onresize:事件会在窗口或框架被调整大小时发生。
所有主流浏览器都支持。
用法:前两种~
支持的标签:<a>, <address>, <b>, <big>, <blockquote>, <body>, <button>, <cite>, <code>, <dd>, <dfn>, <div>, <dl>, <dt>, <em>, <fieldset>, <form>, <frame>, <h1> to <h6>, <hr>, <i>, <img>, <input>, <kbd>, <label>, <legend>, <li>, <object>, <ol>, <p>, <pre>, <samp>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <table>, <textarea>, <tt>, <ul>, <var>
⑩onscroll:事件在元素滚动条在滚动时触发。(支持冒泡,不可以取消,事件类型Event)
提示:使用CSS的overflow样式属性创建滚动条。
浏览器都支持~
用法:三种,不累述了。。。
支持的标签:<address>, <blockquote>, <body>, <caption>, <center>, <dd>, <dir>, <div>, <dl>, <dt>, <fieldset>, <form>, <h1> - <h6>, <html>, <li>, <menu>, <object>, <ol>, <p>, <pre>, <select>, <tbody>, <textarea>, <tfoot>, <thead>, <ul>