index封装
就是求元素在父级当中的位置:
思路:
<!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封装的更多相关文章
- html/京东项目/京东网页高仿/js/jq/css/java web/
登录部分HTML+CSS: <!DOCTYPE html><html> <head> <meta charset="UTF-8& ...
- 瀑布流 &留言板
实例:瀑布流 留言板(一)瀑布流瀑布流实现原理分析1.ajax文件内容function ajax(method, url, data, success) { var xhr = null; ...
- js仿京东轮播图效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- HTML番外整理
经过一周的个人项目与一周的团体项目,我学到了一些有用的内容,特分享如下: 一.视频 1.对在线视频的添加 在各大网站打开一个视频,在下方的分享找到HTML代码,然后复制HTML代码到自己的代码中. 2 ...
- JS轮播图
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- springmvc 例
1.结构 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvaXRscWk=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCM ...
- HTML中插入视频
最常用的向HTML中插入视频的方法有两种,一种是古老的<object></object>标签,一种是html5中的<video></video>标签. ...
- Java斗地主案例、异常和自定义异常整理
模拟斗地主洗牌发牌 1.1 案例介绍 按照斗地主的规则,完成洗牌发牌的动作. 具体规则: 1. 组装54张扑克牌 2. 将54张牌顺序打乱 3. 三个玩家参与游戏,三人交替摸牌,每人17张牌,最后三张 ...
- 基于cytoscape.js 、 d3.js实现的关系图谱初级版本
前面的文章已经介绍了cytoscape.js . d3.js的安装及简单demo,现在展示从html页面转移到vue项目下的最初版的demo 效果图: 代码如下: <template> & ...
随机推荐
- 用string存取二进制数据
STL的string很强大,用起来也感觉很舒服,这段时间在代码中涉及到了用string存取二进制数据的问题,这里记录一下,以供以后参考. 首先提一下STL中string的参考资料:http://www ...
- js 根据title从下级往上级查找
var menuData = [{ name: 'manage', title: '测试1', icon: 'home', }, { title: '测试2', name: 'car-parent', ...
- Javascript Event事件-总结
一.事件类型 例如:mouseover鼠标移动到.keydown键盘按下 二.事件目标 是发生的事件或与之相关的对象,window.document和Element对象是最常见的事件目标 三.事件对象 ...
- 博客已迁移至512z.com
本博客已迁移至http://blog.512z.com,此处今后不再更新
- 用于检测进程的shell脚本代码小结
本文介绍一段shell脚本,它可以检测某进程或某服务是否正在运行,然后以邮件通知.有需要的朋友参考下 一个简单的shell脚本,用来找出关键的服务是否正在运行,适用于Linux操作系统或Unix操作系 ...
- atitit.html5 vs 原生 app的区别与选择
atitit.html5 vs 原生 app的区别与选择 1. html5的优点 1 1.1. 最大优势::在跨平台(ios苹果,android安卓等) 1 1.2. 开放性 1 1.3. 快速的更 ...
- atitit,it人怎么样才容易事业成功?? 有以下五种性格的人容易成功
atitit,it人怎么样才容易事业成功?? 有以下五种性格的人容易成功 有以下五种性格的人容易成功 一.不撞南墙不回头的人:由于这种人有脚踏实地,做事拼命.不撞南墙不回头的性格特点, 势有不到黄河心 ...
- delphi无边框可拖动窗体
unit UFrmModless; interface uses Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, ...
- 信号处理函数(1)-alarm定时器
定义: unsigned int alarm(unsigned int seconds); 表头文件: #include<unistd.h> 说明: alarm()用来设置信号SI ...
- 03、Windows Phone 套接字(Socket)实战之WP客户端设计
因为 PC 端和 WP 端进行通信时,采用的自定义的协议,所以也需要定义 DataType 类来判断 通信数据的类型,并且把数据的描述信息(head) 和数据的实际内容(body)进行拼接和反转,所以 ...