js中页面加载完成后执行的几种方式及执行顺序
在js和jquery使用中，常用到页面加载完成后执行某一方法。经过整理，大概是五种方式（其中有的只是书写方式不同）。javascript
1：使用jQuery的$(function){};java
2：使用jquery的$(document).ready(function(){});前二者本质上没有区别，第1种是第2种的简写方式。两个是document加载完成后就执行方法。jquery
3：使用jQuery的$(window).load(function(){});dom
4:使用window.onload = function(){} 第3种和第4种都是等到整个window加载完成执行方法体。二者也没有区别，只是一个使用dom对象，一个使用jQuery对象。对象
5：在标签上静态绑定onload事件，<body onload="aaa()">等待body加载完成，就会执行aaa()方法。事件
那么，这五种方式，执行的前后顺序是怎么样的呢？ip
经过下方代码验证发现：io
使用1：jQuery的$(function){}和2：jquery的$(document).ready(function(){});不管位置放置在哪里，老是优先其他三种方式（缘由是：这两种方式是在document加载完成后就执行，后三种是等到整个window页面加载完成后才执行），这二者之间的执行顺序是谁在上方谁优先执行。function
使用3：jQuery的$(window).load(function(){});方法
4:window.onload = function bbb(){}这两种方式，老是优先于<body onload="aaa()">执行。他们二者执行顺序也是根据谁在上方谁先执行。
使用5：<body onload="aaa()">老是最后执行。
<script type='text/javascript'>
window.onload = function(){
alert("页面加载完成====》onload");
}
$(window).load(function(){
alert("jquery===》window load" );
})
$(document).ready(function () {
alert("jquery====》document ready");
});
$(function(){
alert("jquery====》document onload");
});
function aaa(){
alert("静态标签====》onload");
}
</script> <body onload="aaa()"> </body>
- 1. js中页面加载完成后执行的几种方式及执行顺序
- 2. 页面加载完成后执行JS的5种方式
- 3. 页面加载完成后执行js
- 4. js实现 页面加载 完成 后顺序 执行
- 5. Javascript中页面加载完成后优先执行顺序
- 6. 页面加载完成后执行JS的方式
- 7. JQuery的几种页面加载完执行三种方式
- 8. 页面加载时执行js的几种方法
- 9. html之页面自动执行（加载）js的几种方法
- 10. 页面自动执行（加载）js的几种方法
- 更多相关文章...
- • MyBatis SqlSession和Mapper接口执行Sql - MyBatis教程
- • Redis主从复制的配置方法和执行过程 - Redis教程
- • 使用阿里云OSS+CDN部署前端页面与加速静态资源
- • 常用的分布式事务解决方案
-
每一个你不满意的现在，都有一个你没有努力的曾经。