【jQuery之DOM对象和jQuery对象的转换与区别分析】教程文章相关的互联网学习教程文章

jQuery源码分析-04 选择器-Sizzle-工作原理分析

作者:nuysoft/高云 QQ:47214707 EMail:nuysoft@gmail.com 声明:本文为原创文章,如需转载,请注明来源并保留原文链接。 在分析Sizzle源码之前,先整理一下选择器的工作原理 先明确一些选择器中用到的名词,后边阅读时不会有歧义: 选择器表达式: "div > p" 块表达式: "div" "p" 并列选择器表达式: "div, p" 块分割器: Sizzle中的chunker正则,对选择器表达式从左向右分割出一个个块表达式 查找器: 对块表达式进行查找,...

jQuery源码分析-03构造jQuery对象-工具函数

作者:nuysoft/高云 QQ:47214707 EMail:nuysoft@gmail.com 声明:本文为原创文章,如需转载,请注明来源并保留原文链接。 读读写写,不对的地方请告诉我,多多交流共同进步,本章的的PDF等本章写完了发布。 jQuery源码分析系列的目录请查看 http://nuysoft.iteye.com/blog/1177451,想系统的好好写写,目前还是从我感兴趣的部分开始,如果大家有对哪个模块感兴趣的,建议优先分析的,可以告诉我,一起学习。 3.4 其他静态工具函...

jQuery(1.6.3) 中css方法对浮动的实现缺陷分析

jQuery的css方法统一了两种写法,直接使用float属性即可,如下css方法中传参数“float”即可以设置也可以获取元素的float。 代码如下:<div id="d1">float div</div> <script type="text/javascript"> $(#d1).css(float, right); var str = $(#d1).css(float); alert(str); </script> 但jQuery非要自作聪明,加上对cssFloat和styleFloat的支持,见API文档,比如获取元素的float属性时,以下是等价的。1 $(div.left).css(float); 2...

jquery中:input和input的区别分析

代码如下:<script type="text/javascript"> $(function(){ $(":input").focus(function(){ $(this).addClass("focus"); }).blur(function(){ $(this).removeClass("focus"); }); })//这个效果第三个textarea也会添加样式 </script> <form action="" method="post" id="regForm"> <fieldset> <legend>个人基本信息</legend> <div> <label for="username">名称:</label> <input id="username" type="text" /> </div> <div> <label fo...

jQuery选择器的工作原理和优化分析

每次申明一个jQuery对象的时候,返回的是jQuery.prototype.init 对象,很多人就会不明白,init明明是jQuery.fn的方法啊,实际上这里不是方法,而是init的构造函数,因为js的prototype对象可 以实现继承,加上js的对象只是引用不会是拷贝,new jQuery,new jQuery.fn和new jQuery.fn.init的子对象是一样的,只是有没有执行到init的不同,这里就不讲原因了,等下一篇再讲为什么会是这样。 当我们使用选择器的时候$(selector,content),...

Jquery中显示隐藏的实现代码分析

$("#id").show()//表示display:block, $("#id").hide()//表示display:none; $("#id").toggle()//切换元素的可见状态。如果元素是可见的,切换为隐藏的;如果元素是隐藏的,切换为可见的。 $("#id").css('display','none'); $("#id").css('display','block'); //或 $("#id")[0].style.display = 'none'; //$("#id")返回的是JQuery12 //它是个集合肯定没有display属性

jQuery :nth-child前有无空格的区别分析【图】

然后,我写了如下html: <table width="200" border="1"> <tr class="a"> <td>11</td> <td>12</td> <td>13</td> </tr> <tr class="a"> <td>21</td> <td>22</td> <td>23</td> </tr> <tr class="a"> <td>31</td> <td>32</td> <td>33</td> </tr></table> 预期效果是:于是我写了如下jQ: $(".a:nth-child(2)").css("color","red"); 运行发现结果竟然是:我百思不得其解啊。。最后发现把JQ改写为: $("...

jQuery 源码分析笔记(6) jQuery.data

data部分的代码从1381行开始。最开始的几行关键代码: 代码如下:jQuery.extend({ // 存储数据的地方,关键实现核心 cache: { }, // 分配ID用的seed uuid: 0, // 为了区别不同的jQuery实例存储的数据,使用前缀+jQuery版本号+随机数作为Key expando: "jQuery" + (jQuery.fn.jquery + Math.random()).replace(/\D/g, ""), // 以下元素没有Data:embed和applet(这玩意还活着么),除了Flash之外的object。 noData: { "embed": true,...

jQuery 源码分析笔记(7) Queue

每个Element可以拥有多个队列,但是基本上都只使用到一个,即默认的fn队列。队列允许一系列函数被异步地调用而不会阻塞程序。例如:$("#foo").slideUp().fadeIn();其实这个就是我们大家常用的链式调用,实际上这是一个Queue。所以队列和Deferred地位类似,是一个内部使用的基础设施。当slideUp运行时,fadeIn被放到fx队列中,当slideUp完成后,从队列中被取出运行。queue函数允许直接操作这个链式调用的行为。同时,queue可以指定队...

jQuery 源码分析笔记(5) jQuery.support

其中jQuery.browser已经提供了根据UserAgent检测的浏览器信息。而jQuery.support 使用特性检测来检查浏览器的功能以及Bug。 和文档一样,首先说明一下,这个模块是很底层的代码,基本不需要在日常开发中使用,但是插件的开发者更需要。因为插件需要兼容各个浏览器。首先看一下 support模块提供了哪些浏览器特性的检测,以下结果是在Chrome 13 Dev下看到的结果。根据浏览器的不同,这里的成员可能会有变化。(PS:再次吐槽IE,大部分...

jQuery 源码分析笔记(3) Deferred机制

Deferred把回调函数注册到一个队列中,统一管理,并且可以同步或者异步地调用这些函数。jQuery.Deferred()用来构造一个Deferred对象。该对象有状态值,共有三种: Rejected, Resolved和初始状态。其中Resolved表示该操作成功完成了,而Rejected 则表示出现了错误,调用失败。Deferred对象的主要成员如下: done(callback): 注册一个callback函数,当状态为resolved时被调用。 * fail(callback): 注册一个callback函数,当状态为reje...

jQuery 源码分析笔记(4) Ready函数

这个功能在 jQuery的文档中提到了三种等价的形式: 代码如下:// 定义在jQuery.fn.ready $(document).ready(handler); // 和上一个是同一个,不推荐 $().ready(handler); // 单独在jQuery对象中处理 $(handler); // 以上这个形式的定义: if(jQuery.isFunction(selector) { return rootjQuery.ready(selector); } 因此实际上都归结与一个形式:jQuery.fn.ready(fn)。定义如下: 代码如下:ready: function(fn) { // 绑定事件到DOM...

jQuery 源码分析笔记(2) 变量列表

_jQuery = window.jQuery; _$ = window.$; 这两个变量是jQuery唯一使用的两个全局变量。在jQuery.noConflict()函数中,会把这两个变量恢复回去。 对于浏览器检测,jQuery使用的是检查UserAgent,而没有使用特性检测。 rwebkit = /(webkit)[ \/]([\w.]+)/, ropera = /(opear)(?:.*version)?[ \/](\w+)/, rmsie = /(msie) ([\w.]+)/, rmozilla = /(mozilla)(?:.*? rv:([\w.]+))?/, 初始化函数init jQuery对JS对象的处理比较绕,而最终...

jQuery创建插件的代码分析

创建jQuery插件,基本的格式是上面这段代码: 代码如下:(function ($) { //add code here })(jQuery) 我们怎么理解? 第一步:function ($){}定义了一个匿名的函数,有一个参数,$是参数名,和其他的参数名没什么区别。 第二步:(function ($){})(jQuery) 我们要执行一个匿名函数的时候,通常用var func = function ($) { },然后func(参数)这样的形式。这里func就是一个Function对象。但更简洁的(function ($) {}),这时用括号,...

JQuery优缺点分析说明

1、jQuery实现脚本与页面的分离 在HTML代码中,我们还经常看到类似这样的代码: <form id="myform" onsubmit=return validate();"> 即使validate()函数可以被放置在一个外部文件中,实际上我们依然是把页面与逻辑和事件混杂在一起。jQuery让你可以将这两部分分离。借助于jQuery,页面代码将如下所示: <form id="myform"> 接下来,一个单独的JS文件将包含以下事件提交代码: 代码如下:$("myform").submit(function(){ ...you...

DOM - 相关标签