[ jquery ] 关于jQuery中的自加载!
来源:互联网 发布:男士风衣 知乎 编辑:程序博客网 时间:2024/06/07 12:21
1. 估计很多人都会用到jQuery中的each方法。
那就来看一看jQuery都干了些什么。
找到jquery中的each源码:
each: function( object, callback, args ) {var name, i = 0,length = object.length,isObj = length === undefined || jQuery.isFunction( object );if ( args ) {if ( isObj ) {for ( name in object ) {if ( callback.apply( object[ name ], args ) === false ) {break;}}} else {for ( ; i < length; ) {if ( callback.apply( object[ i++ ], args ) === false ) {break;}}}// A special, fast, case for the most common use of each} else {if ( isObj ) {for ( name in object ) {if ( callback.call( object[ name ], name, object[ name ] ) === false ) {break;}}} else {for ( ; i < length; ) {if ( callback.call( object[ i ], i, object[ i++ ] ) === false ) {break;}}}}return object;},
这段代码还是比较简单的,应该没什么问题.
为了测试这个东西,我写了下面一段js;
$.each($(".demo"),function(){console.log("show");});
<a href="" class="demo"></a><a href="" class="demo"></a><a href="" class="demo"></a>
然后拿着jQuery的源码来调试,以为能得到正确的结果。可是很遗憾。
可以看到,这里的object竟然不是我所想要的那三个html对象,竟然是js内置的8种数据类型。
之后在jquery的源码中加了一段代码:
console.log(Object.prototype.toString(object));console.log(length);
之后的输入如下:
也就是说在文档加载的时候,jQuery会用each遍历dom对象,即使没有使用
$(function(){});
当遍历指定对象之后,依旧会继续冒泡遍历父级元素。
2. 根据jQuery的源码使用回调函数参数
$.each($(".demo"),function(a,b){console.log(a + "" + $(a).attr("class"));})
从源码可以看到:
callback.call( object[ i ], i, object[ i++ ] )最后都将当前对象通过call方法传递给了回调函数,那么就可以像上面一样去使用当前对象中的属性。当然也可以直接用this来调用。
如果说复杂些的东西,比如,这里我是将$(".demo")作为object传递进去给$.each()
如里某些时候不是传递的jQuery或者html对象。而是一个Object或者array。
而在array中又存在很多其它的object或者方法。
这样就能弄出更多的效果。
3. 采用call或者apply实现回调模式.
从上面的代码可以看到:
callback.call(obj,args)
callback.apply([obj],args)
之类的代码,这里只需要传递callback函数,就能实现自己调用,这对于提高代码的复用程度用处不小。
但是也存在某些缺点,比如代码可读性降低,耦合程度增加等。
偶有所得,以记录之,以防忘记!
0 0
- [ jquery ] 关于jQuery中的自加载!
- jQuery中的dom加载
- 关于jquery中的.serialize方法
- 关于jQuery 中的datepicker使用。
- 关于Jquery延迟加载问题(jquery.timeout.js)
- jQuery加载
- 关于JQuery获取异步加载的元素
- 关于Jquery datatable动态加载数据心得
- JQuery中的事件 (一.加载DOM)
- 转自w3c,从网上加载jquery库
- JQuery运用toggle实现网页加载完成自动弹窗
- 关于jsp加载jquery时,显示加载失败
- 关于 jQuery About jQuery
- Jquery中的(function($){...})(jQuery)
- 【jQuery】jQuery中的Ajax
- jQuery中的(function($){...})(jQuery)
- jQuery-jQuery中的事件
- Jquery中的(function($){...})(jQuery)
- 程序员的奋斗史(三十四)——人在囧途之应聘篇(四)
- Delphi版本号对照
- art.dialog 与jquery ajax请求问题
- #pragma详解
- uva 105 - The Skyline Problem(暴力)
- [ jquery ] 关于jQuery中的自加载!
- OpenGL: 视图矩阵的推导
- 《美国骗局》奥斯卡提名的背后:云计算造就时空变换
- 数据库分页大全(oracle利用解析函数row_number高效分页)
- Linux启动报错UNEXPECTED INCONSISTENCY解决方法
- extern使用方法总结
- Map,HashMap,Hashtable,TreeMap总结
- matlab图像处理基础
- CSS 中Margin参数詳解