就是求元素在父级当中的位置：

思路：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<ul id="a">

    <li id="foo">foo</li>

    <li id="bar">bar</li>

    <li id="baz">baz</li>

</ul>

</body>

</html>

<script type="text/javascript">

    function a(obj) {

        var b = obj.parentNode.children;

        var i=0;

        for(i=0;i<b.length;i++){

            if(b[i] == obj){

                return i;

            }

        }

    }

    window.onload = function () {

        var li = document.getElementsByTagName("li")

        var i=0;

        for(i=0;i<li.length;i++){

            li[i].onclick = function () {

                alert(a(this));

            }

        }

    }

</script>

封装：

//index,求元素在父级当中的位置

function getIndex(obj) {

    var aBrother = obj.parentNode.children;

    var i=0;

    for(i=0;i<aBrother.length;i++){

        if(aBrother[i] == obj){

            return i;

        }

    }

}

VQuery.prototype.index = function () {

    return getIndex(this.elements[0]);

};

详细可查VQuery的封装。

index封装的更多相关文章

  1. html/京东项目/京东网页高仿/js/jq/css/java web/

    登录部分HTML+CSS: <!DOCTYPE html><html>    <head>        <meta charset="UTF-8& ...

  2. 瀑布流 &留言板

    实例:瀑布流 留言板(一)瀑布流瀑布流实现原理分析1.ajax文件内容function ajax(method, url, data, success) {    var xhr = null;   ...

  3. js仿京东轮播图效果

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  4. HTML番外整理

    经过一周的个人项目与一周的团体项目,我学到了一些有用的内容,特分享如下: 一.视频 1.对在线视频的添加 在各大网站打开一个视频,在下方的分享找到HTML代码,然后复制HTML代码到自己的代码中. 2 ...

  5. JS轮播图

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  6. springmvc 例

    1.结构 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvaXRscWk=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCM ...

  7. HTML中插入视频

    最常用的向HTML中插入视频的方法有两种,一种是古老的<object></object>标签,一种是html5中的<video></video>标签. ...

  8. Java斗地主案例、异常和自定义异常整理

    模拟斗地主洗牌发牌 1.1 案例介绍 按照斗地主的规则,完成洗牌发牌的动作. 具体规则: 1. 组装54张扑克牌 2. 将54张牌顺序打乱 3. 三个玩家参与游戏,三人交替摸牌,每人17张牌,最后三张 ...

  9. 基于cytoscape.js 、 d3.js实现的关系图谱初级版本

    前面的文章已经介绍了cytoscape.js . d3.js的安装及简单demo,现在展示从html页面转移到vue项目下的最初版的demo 效果图: 代码如下: <template> & ...

随机推荐

  1. tsung的配置使用

    1.在root下新建.tsung文件,在.tsung文件新建log文件夹..tsung文件用于存放log和xml文件 2.复制/usr/local/tsung/share/doc/tsung/exam ...

  2. RTTI、dynamic_cast、typeid、类与类之间的关系uml

    一.RTTI Run-time type information (RTTI) is a mechanism that allows the type of an object to be deter ...

  3. c++，当const char*为0时，不能将其直接赋给string

    下面程序会崩溃: const char* t_objName = (obj!=NULL)?obj->getName(): 0; string objName=t_objName; cout< ...

  4. mysql_use_result & mysql_store_result & MYSQLI_ASYNC

    博文一 : 在使用 mysql_query() 进行一次查询后,一般要用这两个函数之一来把结果存到一个 MYSQL_RES * 变量中. 两者的主要区别是,mysql_use_result() 的结果 ...

  5. jQuery事件：bind、delegate、on的区别

    最近在AngularJS的开发中,遇到一个神奇的事情:我们用到livebox来预览评论列表中的图片, 然而评论列表是由Angular Resource动态载入的.不可思议的是,点击这些动态载入的图片仍 ...

  6. [svc]jq神器使用

    jq神器 处理json数据 支持过滤某字段 支持数学运算(对字段处理) 安装 yum install -y jq 使用 参考: http://blog.just4fun.site/command-to ...

  7. nginx源代码分析--GDB调试

    利用gdb[i]调试nginx[ii]和利用gdb调试其他程序没有两样,只是nginx能够是daemon程序,也能够以多进程执行,因此利用gdb调试和寻常会有些许不一样. 当然,我们能够选择将ngin ...

  8. Centos7 安装Git-cola

    首先安装Git sudo yum -y install git* 找到 git-all.noarch , 安装这个. sudo yum install git-all.noarch ========= ...

  9. 开源搜索引擎评估:lucene sphinx elasticsearch (zhuan)

    http://lutaf.com/158.htm ************************ 开源搜索引擎程序有3大类 lucene系,java开发,包括solr和elasticsearch s ...

  10. dp之多重背包poj1276

    题意:有现今cash,和n种钱币,每种钱币有ni个,价值为di,求各种钱币组成的不超过cash的最大钱数....... 思路:二进制拆分转化为01背包,或者转化为完全背包都是可以的. 反思:这个题目我 ...