本文描述了点击li标签弹出相应索引函数的JS实现。分享给大家参考，如下：

需求：点击li标签弹出相应的索引

先看效果：

Html结构：

Ul id='ul1' li我是li label1/li li我是li label2/li Li我是Li label3/Li Li我是Li label4/Li Li我是Li label5/Li/ul方法1 :直接给标签添加索引的方法。

var list=document . getelementbyid(' ul1 ')。儿童；//获取的所有li标签(var I=0；ilist.lengthI ){//遍历每个li标签列表[I]。setattribute ('index '，I ^ 1)；//添加索引列表[I]。onclick=function () {alert('您单击了' this.getAttribute('index')' li标记')；//获取添加的li标签的元素值}}完整的测试示例如下：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www . w3 . org/TR/XHTML 1/DTD/XHTML 1-Transitional . DTD ' html xmlns=' http://www . w3 . org/1999/XHTML ' hearteta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8 '/title js单击li标签，会弹出相应的索引/title/head dyul id=' ul1 ' li我是li标签1/li li我是li标签2/li li我是li标签3/li li我是li标签4/我是Li标签5/Li/ulscriptvar list=document . get .//获取(var I=0；ilist.lengthI ){//遍历每个li标签列表[I]。setattribute ('index '，I ^ 1)；//添加索引列表[I]。onclick=function () {alert('您单击了' this.getAttribute('index')' li标记')；//获取添加的li标记的元素值}}/script/body/html方法2 :使用闭包方法

var list=document . getelementbyid(' ul1 ')。儿童；//获取的所有li标签(var I=0；ilist.lengthI) {//遍历每一个li标签函数outer(){ var num=I ^ 1；Function inner () {alert('您单击了' num' li标记')；}返回内部；}//为每个li标签注册点击事件列表[I]。onclick=outer()；}感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具：http://tools.jb51.net/code/HtmlJsRun来测试上述代码的运行效果。

更多对JavaScript相关内容感兴趣的读者可以查看本网站专题：《JavaScript操作DOM技巧总结》、《JavaScript页面元素操作技巧总结》、《JavaScript事件相关操作与技巧大全》、《JavaScript查找算法技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》、《JavaScript错误与调试技巧总结》和0103010

希望本文对JavaScript编程有所帮助。