多个$(document).ready()的执行顺序实例分析


Posted in Javascript onJuly 26, 2014

本文以实例形式说明了多个$(document).ready()的执行顺序问题,由实例可以看出多个$(document).ready()的执行顺序并非单纯的顺序执行,其与嵌套层级也有一定的关系。具体实例代码如下:

<html>
<head>
<script src="./jquery-1.9.0.min.js"></script>
<script type="text/javascript">
  $(function(){
    alert('1');
    $(function(){
      alert('2');
      $(function(){
        alert('3');
      });
    });


  });
</script>
<body>
TTTTTTTTTTTT
<script type="text/javascript">
  $(document).ready(function() {
    alert('4');
    $(function(){
      alert('5');
    });


  });
</script>
KKKKKKKKKKKK
<script type="text/javascript">
  $(function(){
    alert('6');
    $(document).ready(function() {
      alert('7');
    });


  });
</script>
</body>
</html>

运行alert显示顺序为:1,4,6,2,5,7,3
读者可以自己测试体验一下,以加深对多个$(document).ready()执行顺序的理解。

Javascript 相关文章推荐
javascript 日期时间 转换的方法
Feb 21 Javascript
Javascript跨域请求的4种解决方式
Mar 17 Javascript
JavaScript替换当前页面的方法
Apr 03 Javascript
JavaScript 匿名函数和闭包介绍
Apr 13 Javascript
javascript实现点击单选按钮链接转向对应网址的方法
Aug 12 Javascript
jQuery多级联动下拉插件chained用法示例
Aug 20 Javascript
jQuery Plupload上传插件的使用
Apr 19 jQuery
webpack打包并将文件加载到指定的位置方法
Feb 22 Javascript
AngularJS 多指令Scope问题的解决
Oct 25 Javascript
JS开发自己的类库实例分析
Aug 28 Javascript
基于ant design日期控件使用_仅月份的操作
Oct 27 Javascript
vue中的计算属性和侦听属性
Nov 06 Javascript
jquery 取子节点及当前节点属性值
Jul 25 #Javascript
jquery text()方法取标签中的文本
Jul 25 #Javascript
jquery根据属性和index来查找属性值并操作
Jul 25 #Javascript
判断日期是否能跨月查询的js代码
Jul 25 #Javascript
直接在JS里创建JSON数据然后遍历使用
Jul 25 #Javascript
使用documentElement正确取得当前可见区域的大小
Jul 25 #Javascript
JS判断变量是否为空判断是否null
Jul 25 #Javascript
You might like
PHP面向对象程序设计中的self、static、parent关键字用法分析
2019/08/14 PHP
PHP mkdir创建文件夹实现方法解析
2020/11/13 PHP
javascript下有关dom以及xml节点访问兼容问题
2007/11/26 Javascript
js操作二级联动实现代码
2010/07/27 Javascript
新增加的内容是如何将div的scrollbar自动移动最下面
2014/01/02 Javascript
js控制href内容的连接内容的变化示例
2014/04/30 Javascript
Jquery使用css方法改变样式实例
2015/05/18 Javascript
JavaScript实现给按钮加上双重动作的方法
2015/08/14 Javascript
jquery+html5烂漫爱心表白动画代码分享
2015/08/24 Javascript
jQuery焦点图切换特效代码分享
2015/09/15 Javascript
javascript滚轮控制模拟滚动条
2016/10/19 Javascript
jQuery动态产生select option下拉列表
2017/03/15 Javascript
js实现颜色阶梯渐变效果(Gradient算法)
2017/03/21 Javascript
微信小程序 websocket 实现SpringMVC+Spring+Mybatis
2017/08/04 Javascript
vue移动端轻量级的轮播组件实现代码
2018/07/12 Javascript
react-navigation之动态修改title的内容
2018/09/26 Javascript
Vue项目vscode 安装eslint插件的方法(代码自动修复)
2020/04/15 Javascript
JS 创建对象的模式实例小结
2020/04/28 Javascript
[55:03]LGD vs EG 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
python实现html转ubb代码(html2ubb)
2014/07/03 Python
通过Python来使用七牛云存储的方法详解
2015/08/07 Python
在django中使用自定义标签实现分页功能
2017/07/04 Python
深入理解Python中的*重复运算符
2017/10/28 Python
Python标准库shutil用法实例详解
2018/08/13 Python
Python3爬虫学习之应对网站反爬虫机制的方法分析
2018/12/12 Python
python 多维高斯分布数据生成方式
2019/12/09 Python
如何在Django中使用聚合的实现示例
2020/03/23 Python
基于keras中的回调函数用法说明
2020/06/17 Python
Python QTimer实现多线程及QSS应用过程解析
2020/07/11 Python
详解HTML5中download属性的应用
2015/08/06 HTML / CSS
加拿大在线旅游公司:Flighthub
2019/03/11 全球购物
酒店前台接待岗位职责
2013/12/03 职场文书
2014医学院领导干部四风对照检查材料思想汇报
2014/09/16 职场文书
生死抉择观后感
2015/06/09 职场文书
vue引入Excel表格插件的方法
2021/04/28 Vue.js
OpenStack虚拟机快照和增量备份实现方法
2022/04/04 Servers