jQuery源码分析笔记(4)Ready函数
2023-06-13 09:14:28 时间
这个功能在jQuery的文档中提到了三种等价的形式:
复制代码代码如下:
//定义在jQuery.fn.ready
$(document).ready(handler);
//和上一个是同一个,不推荐
$().ready(handler);
//单独在jQuery对象中处理
$(handler);
//以上这个形式的定义:
if(jQuery.isFunction(selector){
returnrootjQuery.ready(selector);
}
因此实际上都归结与一个形式:jQuery.fn.ready(fn)。定义如下:
ready:function(fn){
//绑定事件到DOM上
jQuery.bindReady();
//触发回调函数
readyList.done(fn);
//返回jQuery对象
returnthis;
}
实际上jQuery内部并不仅仅只有一个对fn的引用。这里用到了Deferred功能。在75行,为jQuery对象定义了readyList成员。而在442行在bindReady函数中初始化了这个变量:
if(readyList){
return;
}
readyList=jQuery._Deferred();
bindReady函数除了初始化readyList之外,主要处理了浏览器对于绑定事件的区别。IE使用attachEvent而其他浏览器使用addEventHandler。这两个步骤完成后,ready函数使用readyList.resolveWith触发回调函数。除了这个工作外,ready还处理了holdReady。这个API的作用是延迟ready事件的回调,主要目的是在ready事件前做点事情。holdReady设置了一个标志位readyWait。当这个标志位被设置之后,ready在调用readyList.resolveWith之前不停地调用setTimeout(jQuery.ready,1)。即每隔固定时间就递归调用自己(不知道hold时间久了,js引擎会不会栈溢出),这样最后被holdReady释放的时候,setTimeout会沿着调用栈回来的。为了在这个栈完成之前不触发ready回调函数。在每次调用setTimeout的时候,会递增readyWait变量。用来指示被holdReady函数延误了几次调用。
###几个基础辅助函数
在543行开始,定义了几个值得注意的辅助函数:parseJSON,parseXML和globalEval。parseJSON把一个字符串变成JSON对象。我们一般使用的是eval。parseJSON封装了这个操作,但是eval被当作了最后手段。因为最新JavaScript标准中加入了JSON序列化和反序列化的API。如果浏览器支持这个标准,则这两个API是在JS引擎中用NativeCode实现的,效率肯定比eval高很多。目前来看,Chrome和Firefox4都支持这个API。parseJSON使用如下:
//原生JSONAPI。反序列化是JSON.stringify(object)
if(window.JSON&&window.JSON.parse){
returnwindow.JSON.parse(data);
}
//...大致地检查一下字符串合法性
return(newFunction("return"+data))();
parseXML函数也主要是标准API和IE的封装。标准API是DOMParser对象。而IE使用的是Microsoft.XMLDOM的ActiveXObject对象。定义:
if(window.DOMParser){
tmp=newDOMParser();
xml=tmp.parseFromString(data,"text/xml");
}else{
xml=newActiveXObject("Microsoft.XMLDOM");
xml.async="false";
xml.loadXML(data);
}
globalEval函数把一段脚本加载到全局context中。IE中可以使用window.execScript。其他浏览器需要使用eval。因为整个jQuery代码都是一整个匿名函数,所以当前context是jQuery。主要代码:
(window.execScript||function(data){
window["eval"].call(window,data);//在windowcontext下运行
})(data);
相关文章
- jQuery图片切换插件jquery.cycle.js详解编程语言
- jQuery延迟加载(懒加载)插件 – jquery.lazyload.js详解编程语言
- jquery实现全选,取消,反选的功能&实现左侧菜单详解编程语言
- jQuery层次选择器(4个)
- jQuery技巧大放送学习jquery的朋友可以看下
- Jquery实战_读书笔记1—选择jQuery
- jQuery学习基础知识小结
- Jquery知识点三jquery表单对象操作
- jQuery源码分析笔记(2)变量列表
- jQuery源码分析-05异步队列Deferred使用介绍
- jQuery源码中的chunker正则过滤符分析
- jQuery.prototype.init选择器构造函数源码思路分析
- jQuery学习笔记(1)--用jQuery实现异步通信(用json传值)具体思路
- jQuery学习笔记(4)--Jquery中获取table中某列值的具体思路
- 在jQuery中常用的选择器介绍
- jQuery遍历-关于closest()的方法介绍以及与parents()的方法区别分析
- PHP+jQuery实现自动补全功能源码
- jQuery之排序组件的深入解析
- Jquery右下角抖动、浮动实例代码(兼容ie6、FF)
- jquery属性选择器nothas怎么写行悬停高亮显示
- Jquery获取元素的父容器对象示例代码
- jQuery实现的多选框多级联动插件
- jquery统计用户选中的复选框的个数
- 浅谈jQuery事件源码定位问题
- 基于jquery固定于顶部的导航响应浏览器滚动条事件
- jQuery实现数字加减效果汇总
- 分享2个jQuery插件--jquery.fileupload与artdialog
- 一个小例子解释如何来阻止Jquery事件冒泡
- jquery制作select列表双向选择示例代码