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

思路:

<!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. 用string存取二进制数据

    STL的string很强大,用起来也感觉很舒服,这段时间在代码中涉及到了用string存取二进制数据的问题,这里记录一下,以供以后参考. 首先提一下STL中string的参考资料:http://www ...

  2. js 根据title从下级往上级查找

    var menuData = [{ name: 'manage', title: '测试1', icon: 'home', }, { title: '测试2', name: 'car-parent', ...

  3. Javascript Event事件-总结

    一.事件类型 例如:mouseover鼠标移动到.keydown键盘按下 二.事件目标 是发生的事件或与之相关的对象,window.document和Element对象是最常见的事件目标 三.事件对象 ...

  4. 博客已迁移至512z.com

    本博客已迁移至http://blog.512z.com,此处今后不再更新

  5. 用于检测进程的shell脚本代码小结

    本文介绍一段shell脚本,它可以检测某进程或某服务是否正在运行,然后以邮件通知.有需要的朋友参考下 一个简单的shell脚本,用来找出关键的服务是否正在运行,适用于Linux操作系统或Unix操作系 ...

  6. atitit.html5 vs 原生 app的区别与选择

    atitit.html5  vs 原生 app的区别与选择 1. html5的优点 1 1.1. 最大优势::在跨平台(ios苹果,android安卓等) 1 1.2. 开放性 1 1.3. 快速的更 ...

  7. atitit,it人怎么样才容易事业成功?? 有以下五种性格的人容易成功

    atitit,it人怎么样才容易事业成功?? 有以下五种性格的人容易成功 有以下五种性格的人容易成功 一.不撞南墙不回头的人:由于这种人有脚踏实地,做事拼命.不撞南墙不回头的性格特点, 势有不到黄河心 ...

  8. delphi无边框可拖动窗体

    unit UFrmModless; interface uses Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, ...

  9. 信号处理函数(1)-alarm定时器

    定义: unsigned int alarm(unsigned int seconds);   表头文件: #include<unistd.h>   说明: alarm()用来设置信号SI ...

  10. 03、Windows Phone 套接字(Socket)实战之WP客户端设计

    因为 PC 端和 WP 端进行通信时,采用的自定义的协议,所以也需要定义 DataType 类来判断 通信数据的类型,并且把数据的描述信息(head) 和数据的实际内容(body)进行拼接和反转,所以 ...