JavaScript获取li元素的下标
分类:实例代码
使用jQuery获取可以参阅jQuery如何获取当前元素的索引一章节。
下面分享一段使用原生js实现此功能的代码。
代码实例如下:
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.pipipi.net/" /> <title>前端教程网</title> <script> window.onload=function(){ var aLi=document.getElementsByTagName('li'); for (var index = 0; index < aLi.length; index++) { (function (index) { aLi[index].onclick = function () { alert(index); }; })(index); } } </script> </head> <body> <ul> <li>前端教程网一</li> <li>前端教程网二</li> <li>前端教程网三</li> </ul> </body> </html>
上面的代码实现了我们的要求,主要是利用了闭包来实现。
相关阅读:
(1).getElementsByTagName()可以参阅document.getElementsByTagName()一章节。
(2).闭包可以参阅JavaScript闭包用法一章节。
JavaScript获取li元素的下标,这样的场景在实际项目中还是用的比较多的,关于JavaScript获取li元素的下标就介绍到这了。
JavaScript获取li元素的下标属于前端实例代码,有关更多实例代码大家可以查看。