jQuery源码分析14--get与eq的区别
2015-12-30 10:54
483 查看
get与eq的区别
.eq() 减少匹配元素的集合,根据index索引值,精确指定索引对象,jquery对象~~ .get() 通过检索匹配jQuery对象得到对应的DOM元素。
同样是返回元素,那么eq与get有什么区别呢?
eq返回的是一个jQuery对象,get返回的是一个DOM对象。举个例子:
$( "li" ).get( 0 ).css("color", "red"); //错误 $( "li" ).eq( 0 ).css("color", "red"); //正确
get方法本质上是把jQuery对象转换成DOM对象,但是css属于jQuery构造器的,DOM是不存在这个方法的,如果需要用jQuery的方法,我们必须这样写:
var li = $( "li" ).get( 0 ); $( li ).css("color", "red"); //用$包装
取出DOM对象li,然后用$再次包装,使之转变成jQuery对象,才能调用css方法,这样要分2步写太麻烦了,所以jQuery给我们提供了一个便捷方法eq()。
eq()的实现原理就是在上面代码中的把eq方法内部转成jQuery对象:
eq: function( i ) { var len = this.length, j = +i + ( i < 0 ? len : 0 );//正序,逆序 return this.pushStack( j >= 0 && j < len ? [ this[j] ] : [] );
上面实现代码的逻辑就是跟get是一样的,区别就是通过了pushStack产生了一个新的jQuery对象。
jQuery的考虑很周到,通过eq方法只能产生一个新的对象,但是如果需要的是一个合集对象要怎么处理?因此jQuery便提供了一个slice方法:
语法:
.slice( start [, end ] )
作用:
根据指定的下标范围,过滤匹配的元素集合,并生成一个新的 jQuery 对象。
因为是数组对象,意味着我们可以用silce来直接取值了,所以针对合集对象我们可以这样写代码:
var arr = [] arr.push( this.slice(start[,end]) ) this.pushStack(arr)
这个this指的是jQuery对象,因为jQuery对象是数组集合,所以我们可以通过原生的silce方法直接取到集合数,然后通过包装处理即可了。
slice: function() { return this.pushStack( slice.apply( this, arguments ) ); },
相关文章推荐
- noConflict() 方法处理jQuery 命名冲突
- 分享两款带遮罩的jQuery弹出框
- Jquery轮播图制作
- jQuery源码分析13--仿栈与队列的操作(数组的操作)
- 前端(js/jquery) 日期和时间戳的转换
- jQuery拖动元素并对元素进行重新排序
- jquery mobile常用类型参数
- jQuery给元素添加样式的方法详解
- jquery.SuperSlide
- OpenLayers学习笔记4——使用jQuery UI实现測量对话框
- jQuery与Servlet实现文件上传与获取上传进度
- JQuery 选择器
- jquery.reveal弹出框
- 用户登录成功后的信息初始化及持久连接安全机制---php+json+jquery
- Jquery 函数扩展
- jQuery插件
- jQuery给元素添加样式的方法详解
- jQuery拖动元素并对元素进行重新排序
- 分享两款带遮罩的jQuery弹出框
- 基于jQuery实现美观且实用的倒计时实例代码