get与eq的区别

.eq()  减少匹配元素的集合,根据index索引值,精确指定索引对象。
.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 ) );
},

jQuery中get与eq的区别的更多相关文章

  1. 【jQuery】【转】jQuery中的trigger和triggerHandler区别

    trigger(event, [data]) 在每一个匹配的元素上触发某类事件. 这个函数也会导致浏览器同名的默认行为的执行.比如,如果用trigger()触发一个'submit',则同样会导致浏览器 ...

  2. jquery中attr和prop的区别、 什么时候用 attr 什么时候用 prop (转自 芈老头 )

    jquery中attr和prop的区别. 什么时候用 attr 什么时候用 prop   在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这 ...

  3. JQuery中的html(),text(),val()区别

    jQuery中.html()用为读取和修改元素的HTML标签,.text()用来读取或修改元素的纯文本内容,.val()用来读取或修改表单元素的value值. 1.HTML html():取得第一个匹 ...

  4. jQuery中.attr()和.prop()的区别

    之前学习jQuery的时候,学习到了两种取得标签的属性值的方法:一种是elemJobj.attr(),另一种是elemJobj.prop().而在学习JS的时候,只有一种方法elemObj.getAt ...

  5. jquery中attr和prop的区别(转)

    在网络上看到这样一篇关于jquery中attr和prop的区别文章,觉得不错,所以转载了. 在jQuery 1.6中,.attr()方法查询那些没有设置的属性,则会返回一个undefined.如果你要 ...

  6. Jquery中的 height(), innerHeight() outerHeight()区别

    jQuery中的 height innerHeight outerHeight区别 标准浏览器下: height:高度 innerHeight:高度+补白 outerHeight:高度+补白+边框,参 ...

  7. 基于jquery中children()与find()的区别介绍

    本篇文章介绍了,基于jquery中children()与find()的区别,需要的朋友参考下 .children(selector) 方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈).参数可选 ...

  8. jquery中this与$this的区别

    来源:http://www.jb51.net/article/19738.htm jQuery中this与$(this)的区别 $("#textbox").hover( funct ...

  9. jquery中attr和prop的区别分析

    这篇文章主要介绍了jquery中attr和prop的区别分析的相关资料,需要的朋友可以参考下 在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别 ...

随机推荐

  1. 解释型语言和编译型语言的不同以及Python如何运行

    计划写关于Python中如何实现属性管理.函数(或类方法)管理.类管理的几篇成系列的文章. 而这篇文章写在这个系列之前,希望对后面几篇文章的理解有所帮助. 老实说,我也是在网上搜索了一些资料才写的这篇 ...

  2. linux-0.11内核 任务的堆栈切换

    http://blog.163.com/di_yang@yeah/blog/static/86118492201212534924900/ 一直缠绕的两个问题:怎样标识的内核栈与用户栈?如何在内核态堆 ...

  3. asp.net中时间差的问题

    asp.net中时间差的问题 在asp中我们可以用datediff来处理,时间的差,相当的不错,可是在asp.net中C#语言中却没有.可是ASP.net给我们提供了一个TimeSpan,我们可以用它 ...

  4. [jobdu]数组中的逆序对

    http://ac.jobdu.com/problem.php?pid=1348 数组中的逆序对也是个常见的题目,算法导论中也有一些描述,参考:http://www.cnblogs.com/wuyue ...

  5. Java中堆和栈创建对象的区别

    http://blog.csdn.net/hbhhww/article/details/8152838

  6. 【Lucene3.6.2入门系列】第03节_简述Lucene中常见的搜索功能

    package com.jadyer.lucene; import java.io.File; import java.io.IOException; import java.text.SimpleD ...

  7. /MD, /MDD, /ML, /MT,/MTD(使用运行时库)

    1. VC编译选项 多线程(/MT)多线程调试(/MTd)多线程 DLL (/MD)多线程调试 DLL (/MDd) 2. C 运行时库                                 ...

  8. python 检测文件编码等

    参考:http://my.oschina.net/waterbear/blog/149852 chardet模块,能够实现文本编码的检查, 核心代码: import chardet chardet.d ...

  9. Windows7 64下MinGW64/MSYS环境搭建

    原文出处: CompileGraphics Magick, Boost, Botan and QT with MinGW64 under Windows 7 64 http://www.kinetic ...

  10. content:attr()

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...