问题描述:灵活使用jquery中的index方法

方法签名:index([selector|element])

用法概述:P1.index(P2)  //调用者P1可以为对象或集合

  1. 参数为空,返回P1[0]在父容器内的索引;
  2. 参数为字符串(即传入了一个选择器selector),返回P1[0]在P2的所有匹配中的索引,即只要传入字符串,就是在P2匹配的元素中查找P1[0];
  3. 参数为js对象或jquery对象(即传入了一个或一组element),则返回P2[0]在P1中的索引,即只要传入的是对象,就是在P1中查找P2[0];和传入字符串的情况正好相反;

使用实例:

<ul>
    <li class="foo">Outer1</li>
    <li>
        <ul>
            <li>1</li>
            <li id="ok" class="foo">2</li>
            <li>3</li>
            <li class="foo">4</li>
        </ul>
    </li>
    <li>Outer3</li>
</ul>
$("li").index("#ok");     //-1,找不到,因为是在匹配"#ok"的元素中查找$("li")[0]
$("li").index($("#ok"));
$("li").index(".foo");    //0//更多情况可自行测试和研究

jQuery源码: (推荐:)

// Determine the position of an element within
// the matched set of elements
index: function( elem ) {
    // No argument, return index in parent
    if ( !elem ) {
        return ( this[ 0 ] && this[ 0 ].parentNode ) ? this.first().prevAll().length : -1;
    }
    // index in selector
    if ( typeof elem === "string" ) {
        return jQuery.inArray( this[ 0 ], jQuery( elem ) );
    }
    // Locate the position of the desired element
    return jQuery.inArray(
        // If it receives a jQuery object, the first element is used
        elem.jquery ? elem[ 0 ] : elem, this );
}

jquery中的index方法的更多相关文章

  1. jQuery中的index方法介绍

    从jq api手册摘过来的内容,index这个方法在写 tab silder 之类的组件还是比较有用的说. js没有传统的函数重载的概念,但是根据传入参数的不同,js的函数可以完成不同的功能,也可说是 ...

  2. jquery 中一些 特殊方法 的特殊使用 一览表

    cnblogs的页面, 一种是管理页面, 是随笔的列表 a full list of essays. 另一种是 首页. 要搜索文档的话, 就使用 "首页"的那种方式. 一个jque ...

  3. 用JQuery中的Ajax方法获取web service等后台程序中的方法

    用JQuery中的Ajax方法获取web service等后台程序中的方法 1.准备需要被前台html页面调用的web Service,这里我们就用ws来代替了,代码如下: using System; ...

  4. jquery中的ajax方法参数

    引用来自:http://www.cnblogs.com/tylerdonet/p/3520862.html jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String ...

  5. jquery-12 jquery中的工具方法有哪些

    jquery-12 jquery中的工具方法有哪些 一.总结 一句话总结:四个较常用方法.1.isArray();2.isFunction();3.isEmptyObejct();4.trim(); ...

  6. 解决关于jquery中$.get()方法总是报“HierarchyRequestError: Node cannot be inserted at the specified point in the hierarchy”错的方法

    解决关于jquery中$.get()方法总是报“HierarchyRequestError: Node cannot be inserted at the specified point in the ...

  7. jQuery中的join方法

    和JS 中的JOIN 方法一样,将一数组按照JOIN的参数连接起来.比如: var arr = [ "a", "b", "c", " ...

  8. jQuery中的ready方法及实现按需加载css,js

    模拟jQuery中的ready方法及实现按需加载css,js 一.ready函数的实现 经常用jQuery类库或其他类库中的ready方法,有时候想想它们到底是怎么实现的,但是看了一下jQuery中的 ...

  9. $.ajax()方法详解 jquery中的ajax方法

    jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(p ...

随机推荐

  1. Base-Android快速开发框架(一)--概述

    首先简单介绍一下Base.Base是本人长期以来经过10来款APP总结出来的一个Android快速开发框架.包含数据缓存模块.工具包.第三方组件包.网络模块.数据解析.常用主界面布局等.可以快速的开发 ...

  2. 【暑假】[实用数据结构]UVAlive 3026 Period

    UVAlive 3026 Period 题目: Period   Time Limit: 3000MS   Memory Limit: Unknown   64bit IO Format: %lld ...

  3. mysql日期加减问题

    有一个date列,我想修改下,让该列里每个日期都加上7天,怎么写代码?  update [表名] set date=date_add(date, interval 7 day); SELECT * f ...

  4. Good practice release jar to Nexus

    Step  suppose you need to develop a feature,when you finish the feature ,you need to release the jar ...

  5. Bzoj-2005 能量采集 gcd,递推

    题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=2005 题意:题目转换后的模型就是求Σ(gcd(x,y)), 1<=x<=n, ...

  6. Java类的生命周期详解

    引言 最近有位细心的朋友在阅读笔者的文章时,对java类的生命周期问题有一些疑惑,笔者打开百度搜了一下相关的问题,看到网上的资料很少有把这个问题讲明白的,主要是因为目前国内java方面的教材大多只是告 ...

  7. ANT打包J2EE项目war包

    1.下载并安装ant 2.安装ant步骤如下 .解压下载的zip包 .进入解压的目录,把bin目录放入系统变量PATH中. eg:E:\dev_tools\apache-ant-\bin .打开cmd ...

  8. hdoj 1874 畅通工程续【dijkstra算法or spfa算法】

    畅通工程续 Time Limit: 3000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submi ...

  9. js调试工具Console命令详解

    这篇文章主要介绍了js调试工具Console命令详解,需要的朋友可以参考下   一.显示信息的命令 复制代码 代码如下: < !DOCTYPE html> < html> &l ...

  10. 转(HP大中华区总裁孙振耀退休感言)

    开篇转发一篇好文,苦闷,消沉,寂寞,堕落的时候看看. 发现这篇文章是09年之前就有人转发到自己博客了.放到自己的地盘,容易记起有这么个心灵鸡汤.   一.关于工作与生活 我有个有趣的观察,外企公司多的 ...