js 索引下标之li集合绑定点击事件


Posted in Javascript onJanuary 12, 2018

下面一段代码给大家介绍li集合绑定点击事件,具体代码如下所示:

//Method-1:
var items = document.getElementsByTagName('li');
for(var i=0;i<items.length;i++){


items[i].index = i;


items[i].onclick = function(){



this.innerHTML = this.index;

}
}
//Method-2:
var items = document.getElementsByTagName('li');

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


(function(index){



items[i].onclick = function(){



this.innerHTML = index;


}

})(i)
}
//Method-3:
var items = document.getElementsByTagName('li');
for(var i = 0; i<items.length; i++){

items[i].onclick = function(index){


return function(){



this.innerHTML = index;


}

}(i)
}

总结

以上所述是小编给大家介绍的js 索引下标之li集合绑定点击事件,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JAVASCRIPT style 中visibility和display之间的区别
Jan 22 Javascript
Jquery Ajax请求代码(2)
Jan 07 Javascript
jquery eval解析JSON中的注意点介绍
Aug 23 Javascript
JSON+Jquery省市区三级联动
Jan 13 Javascript
js HTML5手机刮刮乐代码
Sep 29 Javascript
详解js数组的完全随机排列算法
Dec 16 Javascript
fckeditor部署到weblogic出现xml无法读取及样式不能显示问题的解决方法
Mar 24 Javascript
实例详解display:none与visible:hidden的区别
Mar 30 Javascript
Axios学习笔记之使用方法教程
Jul 21 Javascript
微信小程序实现商城倒计时
Nov 01 Javascript
JS查找孩子节点简单示例
Jul 25 Javascript
node.js使用zlib模块进行数据压缩和解压操作示例
Feb 12 Javascript
简单的Vue SSR的示例代码
Jan 12 #Javascript
详解如何在react中搭建d3力导向图
Jan 12 #Javascript
关于axios不能使用Vue.use()浅析
Jan 12 #Javascript
Vuex 进阶之模块化组织详解
Jan 12 #Javascript
动态Axios的配置步骤详解
Jan 12 #Javascript
JS兼容所有浏览器的DOMContentLoaded事件
Jan 12 #Javascript
使用JS获取SessionStorage的值
Jan 12 #Javascript
You might like
PHP单例模式定义与使用实例详解
2017/02/06 PHP
php 三大特点:封装,继承,多态
2017/02/19 PHP
js 鼠标拖动对象 可让任何div实现拖动效果
2009/11/09 Javascript
关于js中window.location.href,location.href,parent.location.href,top.location.href的用法与区别
2010/10/18 Javascript
Flex通过JS获取客户端IP和计算机名的实例代码
2013/11/21 Javascript
javascipt:filter过滤介绍及使用
2014/09/10 Javascript
JS实现的在线调色板实例(附demo源码下载)
2016/03/01 Javascript
JavaScript中instanceof运算符的使用示例
2016/06/08 Javascript
JS重载实现方法分析
2016/12/16 Javascript
浅谈webpack 构建性能优化策略小结
2018/06/13 Javascript
JS尾递归的实现方法及代码优化技巧
2019/01/19 Javascript
layui异步加载table表中某一列数据的例子
2019/09/16 Javascript
JS原型对象操作实例分析
2020/06/06 Javascript
python连接mysql并提交mysql事务示例
2014/03/05 Python
跟老齐学Python之不要红头文件(1)
2014/09/28 Python
python使用pil生成缩略图的方法
2015/03/26 Python
Python函数中*args和**kwargs来传递变长参数的用法
2016/01/26 Python
python爬取拉勾网职位数据的方法
2018/01/24 Python
python实现跨excel的工作表sheet之间的复制方法
2018/05/03 Python
使用11行Python代码盗取了室友的U盘内容
2018/10/23 Python
python使用requests模块实现爬取电影天堂最新电影信息
2019/04/03 Python
python获取txt文件词向量过程详解
2019/07/05 Python
关于pymysql模块的使用以及代码详解
2019/09/01 Python
python 利用matplotlib在3D空间中绘制平面的案例
2021/02/06 Python
python re模块常见用法例举
2021/03/01 Python
css3一款3D字体带阴影效果的实现步骤
2013/03/20 HTML / CSS
新加坡网上美容店:Hermo新加坡
2019/06/19 全球购物
2013年大学生的自我鉴定
2013/10/24 职场文书
培训心得体会
2013/12/29 职场文书
《威尼斯的小艇》教学反思
2014/02/17 职场文书
团党委领导干部党的群众路线教育实践活动个人对照检查材料思想汇
2014/10/05 职场文书
劳模先进事迹材料
2014/12/24 职场文书
幼儿园个人师德总结
2015/02/06 职场文书
selenium.webdriver中add_argument方法常用参数表
2021/04/08 Python
python正则表达式re.search()的基本使用教程
2021/05/21 Python
分享CSS盒子模型隐藏的几种方式
2022/02/28 HTML / CSS