Jquery中index()问题
对于Jquery中的index()问题,很多人会说这个很简单的,并不是一个非常困难的方法。笔者开始的时候也是这样子认为的,但是今天遇到一个index的问题,让我忙了一个晚上都没有解决,最后还是使用console.log()一个个地测,最后才发现问题所在。
首先,让我们看下index的用法(资料来源:http://www.php100.com/manual/jquery/)
搜索匹配的元素,并返回相应元素的索引值,从0开始计数。
(1)如果不给 .index() 方法传递参数,那么返回值就是这个jQuery对象集合中第一个元素相对于其同辈元素的位置。
(2)如果参数是一组DOM元素或者jQuery对象,那么返回值就是传递的元素相对于原先集合的位置。
(3)如果参数是一个选择器,那么返回值就是原先元素相对于选择器匹配元素中的位置。如果找不到匹配的元素,则返回-1。
对于(2)(3),相信大家看了相关的文档之后都能了解,下面重点讲一下(1)
这个元素在同辈中的索引位置。这是什么意思呢?看下列代码
<ul>
<div id="foo">foo</div>//(仅仅是假设,不推荐使用这种方法)
<li id="bar">bar</li>
<li id="baz">baz</li>
</ul>
执行$('#bar').index()。返回值是1,而不是0。这是为什么呢?这里因为不传入参数,index()返回的是与('#bar')同辈的位置,而在上述例子当中div是与下面的li同辈的,所以返回值是1.如果你要避免这样的情况出现,唯一的方法就是在搜索元素的时候,尽可能采用$('p') 和$('xx.xx xx p')中后者的方法。这样子就不会出现上述的情况了。或者可以传入参数,也可以避免出现这种情况。其实,这个问题也是笔者在写代码的时候没有遵循详细的原则,导致出现这种错误,不过,学习到这个用法,以后就要注意了。
Jquery中index()问题的更多相关文章
- jQuery中index()方法用法实例
本文实例讲述了jQuery中index()方法用法.分享给大家供大家参考.具体分析如下: 此方法可以搜索匹配元素,并返回元素的索引值.索引值是从0开始的. 语法结构一: 当此方法没有参数的时候,返回值 ...
- jQuery中 index() 方法的使用
假设一个集合中有10个元素,源生js在添加事件的时候,会使用for循环,里面的i的值,就是当前点击元素是集合中的第i个元素.在jquery中,获得i的值的方法如下: <ul id="a ...
- jquery中的index方法
问题描述:灵活使用jquery中的index方法 方法签名:index([selector|element]) 用法概述:P1.index(P2) //调用者P1可以为对象或集合 参数为空,返回P1 ...
- jquery中的index方法和eq方法
jquery的index()方法 搜索匹配的元素,并返回相应元素的索引值,从0开始计数,如果不给 .index() 方法传递参数,那么返回值就是这个jQuery对象集合中第一个元素相对于其同辈元素的位 ...
- [转载]Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结
本文对Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法进行了详细的总结,需要的朋友可以参考下,希望对大家有所帮助. 详细解读Jquery各Ajax函数: ...
- jQuery中的100个技巧
1.当document文档就绪时执行JavaScript代码. 我们为什么使用jQuery库呢?原因之一就在于我们可以使jQuery代码在各种不同的浏览器和存在bug的浏览器上完美运行. < ...
- JQuery中$.each 和$(selector).each()的区别详解
PS:晚上在写页面时,发现了一个问题,$.each 和$(selector).each()有哪些区别?百度搜索关键词,首页显示出来一些前人的经验,总结一下,发上来. 1.$(selector).eac ...
- jQuery中eq()方法用法实例
本文实例讲述了jQuery中eq()方法用法.分享给大家供大家参考.具体分析如下: 此方法能够获取匹配元素集上的相应位置索引的元素. 匹配元素集上元素的位置索引是从0开始的. 语法结构: 复制代码 代 ...
- JQuery中each()的使用方法说明
JQuery中each()的使用方法说明 对于jQuery对象,只是把each方法简单的进行了委托:把jQuery对象作为第一个参数传递给jQuery的each方法.换句话说:jQuery提供的eac ...
随机推荐
- OpenStack学习推荐
前言: 学习.了解.安装部署OpenStack也写了好一段时间了,现在觉得也有点必要写点总结.搞IT这一块基本就这样,不管是搞什么领域,一个项目超过两个月没动它,就基本不知道当时是怎么搞的,当时学 ...
- 一个Tomcat及一个ip,绑定不同的域名,各个域名访问各自不同应用程序的配置方法
http://nickandmiles.blog.163.com/blog/static/23422123201110151492166/ 条件是:这样一种实际情况是,就一台服务器,当公网的IP地址也 ...
- 数学常数e的含义
转载: http://www.ruanyifeng.com/blog/2011/07/mathematical_constant_e.html 作者: 阮一峰 日期: 2011年7月 9日 1. ...
- 如何vs升级后10和12都能同时兼容
如图: 项目2008解决方案sln文件升级2012后,都能同时使用. 升级办法:先复制vs2008版本的解决方案文件.升级2012后,再将文件复制到目录里面即可.注意升级过程中产生的升级文件(Upgr ...
- Android bitmap图片处理
一.View转换为Bitmap 在Android中所有的控件都是View的直接子类或者间接子类,通过它们可以组成丰富的UI界面.在窗口显示的时候Android会把这些控件都加载到内存中 ...
- UML应用:业务内涵的分析抽象&表达
上一篇,架构设计的UML图形思考 ,简介了图形思考设计.表达设计对于架构师的重要意义,以及简介了使用统一建模语言UML描写叙述类以及类之间的继承关系,这样的描写叙述还停留在写代码,表达的但是说是怎样写 ...
- 计算机体系结构-CPU
NUMA
- A different twist on pre-compiling JSPs--reference
I’ve blogged about this topic earlier and expressed my frustrations as to how web containers don’t p ...
- JSP-注释,脚本元素,指令
jsp中的注释 jsp隐藏注释 完全对客户机隐藏,不会将注释内容发送给客户机. 其语法格式为:<%-- comment --%> comment为要添加的文本注释内容. HTML注释 不完 ...
- oracle中的层级递归查询操作
oracle中的层级操作非常方便,在使用之后爱不释手,以前要实现该种数据查询操作,需要非常复杂的实现过程.在oracle中通过connect by可以实现前面的目的,通常情况下层级查询基本都能实现递归 ...