摘要:
看了一边Ajax功能模块代码的实现,最后倒叙查看代码。最后面httpData 和 param两个函数的实现比较简单。// Get the data out of an XMLHttpRequest.// Return parsed XML if content-type header is "xml" and type is "xml" or omitted,// otherwise return plain text.httpData: function(r,type) { var ct = r.getResponseHeader("cont 阅读全文
随笔分类 - JQuery1.0
(十二)jQuery内置特效的实现
2012-02-12 16:14 by kwjlk, 400 阅读, 收藏,
摘要:
jQuery内置特效的实现用了两段extend代码。第一段jQuery.fn.extend扩展了jQuery.fn上的常见特效方法。其中重要的animate方法。第二段jQuery.extend 定义了重要的fx方法、speed方法。支持animate的实现。第一段jQuery.fn.extendjQuery.fn.extend({ // overwrite the old show method _show: jQuery.fn.show, show: function(speed,callback){ return speed ? this.animate(... 阅读全文
(十一)jQuery.extend代码段
2012-02-12 16:10 by kwjlk, 292 阅读, 收藏,
摘要:
在jQuery.init();代码之后有一段jQuery.extend代码。这一段属于对jQuery基本功能的扩展。代码如下:jQuery.init();jQuery.fn.extend({ // We're overriding the old toggle function, so // remember it for later _toggle: jQuery.fn.toggle, toggle: function(a,b) { // If two functions are passed in, we're // toggling o... 阅读全文
(十)jQuery.extend代码段
2012-02-12 16:08 by kwjlk, 339 阅读, 收藏,
摘要:
查看jQuery.css实现代码发现css调用了curCss,而这个curCss调用了swap方法,swap方法没有调用其它方法。于是swap: function(e,o,f) { for ( var i in o ) { e.style["old"+i] = e.style[i]; e.style[i] = o[i]; } f.apply( e, [] ); for ( var i in o ) e.style[i] = e.style["old"+i];}swap方法实现的是将e上的原有属性保存在old前缀的属性上,然后调用... 阅读全文
(九)jQuery.extend代码段
2012-02-12 16:03 by kwjlk, 266 阅读, 收藏,
摘要:
再次返回看init的代码,我抽离出一个init的简明结构:init: function(){ jQuery.initDone = true; jQuery.each( jQuery.macros.axis, function(i,n){ jQuery.fn[ i ] = function(a) { ... }; }); jQuery.each( jQuery.macros.to, function(i,n){ jQuery.fn[ i ] = function(){ ... 阅读全文
(八)jQuery.extend代码段
2012-02-12 15:26 by kwjlk, 285 阅读, 收藏,
摘要:
分析jQuery.find的实现代码,发现其调用了 getAll 、trim、sliding三个方法。getAll: function(o,r) { r = r || []; var s = o.childNodes; for ( var i = 0; i < s.length; i++ ) if ( s[i].nodeType == 1 ) { r.push( s[i] ); jQuery.getAll( s[i], r ); } return r;}trim: function(t){ r... 阅读全文
(七)jQuery.extend代码段
2012-02-12 15:12 by kwjlk, 314 阅读, 收藏,
摘要:
就过之前对grep、map、merge的准备,现在可以入手flter函数了:filter: function(t,r,not) { // Figure out if we're doing regular, or inverse, filtering var g = not !== false ? jQuery.grep : function(a,f) {return jQuery.grep(a,f,true);}; while ( t && /^[a-z[({<*:.#]/i.test(t) ) { var p = jQuery.par... 阅读全文
(六)jQuery.extend代码段
2012-02-12 15:07 by kwjlk, 343 阅读, 收藏,
摘要:
现在就基本上可以把each中所有的代码弄明白了。each: { removeAttr: function( key ) { this.removeAttribute( key ); }, show: function(){ this.style.display = this.oldblock ? this.oldblock : ""; if ( jQuery.css(this,"display") == "none" ) this.style.display = "block"; }, hide: f... 阅读全文
(五)jQuery.extend 代码段
2012-02-12 15:00 by kwjlk, 322 阅读, 收藏,
摘要:
继续分析event中剩余的remove、trigger方法,并附带完全理解handle方法。// Detach an event or set of events from an elementremove: function(element, type, handler) { if (element.events) if (type && element.events[type]) if ( handler ) delete element.events[type][handler.guid]; e... 阅读全文
(四)第一个jQuery.extend代码段
2012-02-12 14:56 by kwjlk, 480 阅读, 收藏,
摘要:
第一个jQuery.Extend代码中的init实现较为复杂,尝试分析init引用的函数并进行阅读。代码量有点大,于是点击所有的jQuery.Extend代码查看,发现在第二个new function之上的jQuery.Extend拓展了jQuery的ready方法,该代码段的实现比较简明易读。此段代码是jQuery.extend({..}),extend只有一个参数且为对象时,对象上的属性被拓展到了调用者jQuery身上。于是可以通过jQuery.ready等访问代码中的方法和属性。jQuery.extend({ /* * All the code that makes DOM... 阅读全文
(三)三段new function的分析
2012-02-12 14:45 by kwjlk, 378 阅读, 收藏,
摘要:
现在我知道new function(){}能够干嘛了。接下来看一下代码中的三个new function(){ ... } 都做了神马?1.第一个,判断浏览器型号和浏览器使用的CSS盒子模型是W3C盒子模型还是IE的Quirks模式new function() { var b = navigator.userAgent.toLowerCase(); // Figure out what browser is being used jQuery.browser = { safari: /webkit/.test(b), opera: /opera/.t... 阅读全文
(二)解决前6条
2012-02-12 14:37 by kwjlk, 427 阅读, 收藏,
摘要:
1.window.undefined = window.undefinedmake the global window.undefined as real undefined value.未定义,当属性没有定义过(不存在)时访问该属性则会返回值:未定义。虽然window.undefined一定会被浏览器定义成了"未定义"的值,但是谁会知道哪个别有用心的浏览器(火狐)是个例外呢。所以,这一段代码做了双重保证。定义了window.undefined属性为未定义的浏览器中执行这一句代码没有任何改变,在没有定义window.undefined属性的浏览器中执行后window.und 阅读全文
(一)划分JQuery的代码结构
2012-02-12 14:21 by kwjlk, 315 阅读, 收藏,
摘要:
将JQuery1.0的全部代码,以第一层为准收起。代码总行数减少,可以对代码大体结构进行梳理和了解。此时代码行数为19行,浏览第一遍后可以看到几个令人好奇的地方和一些简单的外层代码。列举如下:令人好奇的代码:window.undefined = window.undefined 为什么要这么写?new function(){} 这种不是自执行函数( (即function(args){...code ... })(arg) 的形式),那这样写有什么效果啊?简单的外层代码:对美元符号$的处理。Ajax插件(代码量不少,但是从模块的角度看,可以显然的知道后面的代码是属于Ajax插件的,可以在看代码的 阅读全文
浙公网安备 33010602011771号