JavaScript HTML5事件

有3个页面级事件在HTML5版本中被引入。

 事件  说明
 DOMContentLoaded  在DOM树形成后触发(与此同时,图片、CSS和JavaScript可能还在加载)。在这个事件中,脚本运行要早于load事件,因为load事件会等待所有资源(比如图片或广告)加载完之后才触发。这种方式会让页面看起来加载速度更快。
 hashchange  当URL的hash值变化时(不会造成整个窗口刷新)触发。hash值通常在链接中用来指定不同的部分(也被称作为锚点),在使用AJAX加载的页面内容中也会被使用。
 beforeunload  当页面被卸载之前在window对象上触发。

实例:

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title>DOMContentLoaded事件</title>
 6         <meta charset="UTF-8">
 7         <meta name="viewport" content="width=device-width, initial-scale=1.0">
 8     </head>
 9     <body>
10       用户名:  <input id="user" type="text"><br>
11       密码:  <input id="password" type="text"> <br>
12       其它:  <input id="message" type="text">
13 
14         <script>
15             function setup() {
16                 var textinput;
17                 textinput = document.getElementById("user");
18                 // 设置焦点
19                 textinput.focus();
20             }
21 
22             window.addEventListener('DOMContentLoaded',setup,false);
23 
24         </script>
25     </body>
26 </html>

猜你喜欢

转载自www.cnblogs.com/q2546/p/11290926.html