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

思路：

<!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. spring in action 5.1 小结 spring mvc起步

    0 配置 DispatcherServlet 是 spring mvc的核心,常规配置方法可以查看之前博客.springMVC简单例子 在此使用servlet 3 规范和 spring3.1 功能增强 ...

  2. ubuntu内部错误的解决办法

    在ubuntu使用过程中,出现下面错误: 对不起,Ubuntu 16.04出现了内部错误. 这并不是ubuntu16.04特有的问题,好像每一个ubuntu版本都有类似的问题. 解决的办法有2个. 1 ...

  3. COM方式实现C++调用C#代码的一些总结

    首先这个测试没成功,只在本机上可行,在不同机器上测试失败.可能是GUID不对或者没注册成功. 既然已经花了一上午时间去研究,还是总结一下 1.网上说要创建一个snk证书,但不创建也可以.只不过不能放入 ...

  4. atitit.thumb生成高质量缩略图 php .net c++ java

    atitit.java thumb生成高质量缩略图 php .net c++ 1. 图像缩放(image scaling)---平滑度(smoothness)和清晰度(sharpness) 1 2.  ...

  5. 用EA生成实体层代码

    在个人版机房重构中.实体层的代码敲得有点儿烦了.不同的实体仅仅是命名不同.代码结构全然一样.遇到反复的事情,就该动动脑.想想办法了. 以下给大家介绍使用EA生成实体层的代码. 首先.建一个类,注意选择 ...

  6. CentOS6.x和CentOS7.X启动系统不显示进度条设置方法

    [root@ok Desktop]# vi /boot/grub/grub.conf # grub.conf generated by anaconda # # Note that you do no ...

  7. （转载） STL中map用法详解

    Map是STL的一个关联容器,它提供一对一(其中第一个可以称为关键字,每个关键字只能在map中出现一次,第二个可能称为该关键字的值)的数据处理能力,由于这个特性,它完成有可能在我们处理一对一数据的时候 ...

  8. Jquery弹窗

    <title>弹窗</title> <script src="JS/jquery-1.7.2.js"></script> <s ...

  9. [ADC]Linux ADC驱动

    ADC TI adc user guide: http://processors.wiki.ti.com/index.php/Linux_Core_ADC_Users_Guide 问题: 在tools ...

  10. 禁止复制 + 锁右键 + 禁止全选(兼容IE Chrome等)

    function iEsc() { return false; }function iRec() { return true; }function DisableKeys() {    if (eve ...