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> & ...
随机推荐
- Android 使用Post方式提交数据
在Android中,提供了标准Java接口HttpURLConnection和Apache接口HttpClient,为客户端HTTP编程提供了丰富的支持. 在HTTP通信中使用最多的就是GET和POS ...
- [CentOS] CentOS for vsftpd with MySQL Virtual user
從ubuntu 12.04的安裝手法拿到CentOS來真的有些很大的不同 絕大部分的語法.概念都是差不多的,只是指令上有些差別,跟ubuntu 有不一樣的地方特別拿出來另外說明 要讓vsftpd與my ...
- uploadify onSelect
uploadify onSelect [return false]停止选择 $("#fileEleId").uploadify({ 'width': _option.width, ...
- Atitit.异步编程 java .net php python js 的比较
Atitit.异步编程 java .net php python js 的比较 1. 1.异步任务,异步模式, APM模式,, EAP模式, TAP 1 1.1. APM模式: Beg ...
- atitit.判断时间重叠方法总结 java c++ c#.net js php
atitit.判断时间重叠方法总结 java c++ c#.net js php 1. 判断时间重叠具体流程思路 1 2. 重叠算法 实际上就是日期集合跟个时间集合的的交集(乘法算法) 1 3. 代 ...
- [svc]linux查看主板型号及内存硬件信息
公司服务器内存不够用了. 想看看买啥型号的. 购买内存条注意点: ddr3 or4 频率 块钱. 内存槽及内存条: dmidecode |grep -A16 "Memory Device$& ...
- sh 不显示当前的路径
linux中sh是链接到bash上的,所以sh与bash在功能上是没有区别的 只是sh不显示路径!!! sh-4.1# cd /usr/local/src sh-4.1# pwd /usr/local ...
- rsync 精确同步文件用法 (转载)
-- include-from 指定目录下的部分目录的方法: include.txt: aa bb ss Command: rsync -aSz --include-from=/home/inclu ...
- 基于zookeeper、连接池、Failover/LoadBalance等改造Thrift 服务化
对于Thrift服务化的改造,主要是客户端,可以从如下几个方面进行: 1.服务端的服务注册,客户端自动发现,无需手工修改配置,这里我们使用zookeeper,但由于zookeeper本身提供的客户端使 ...
- HIbernate與不支持boolean的數據庫之間的映射
http://soft-development.iteye.com/blog/1225274 ————————————————————————————————————————————————————— ...