需求:點選li標籤,彈出對應的索引

先看效果: html結構:

<ul id="ul1">
    <li>我是li標籤1</li>
    <li>我是li標籤2</li>
    <li>我是li標籤3</li>
    <li>我是li標籤4</li>
    <li>我是li標籤5</li>
</ul>

方法一:直接往標籤裡新增索引的方法

 var list=document.getElementById('ul1').children;//獲取所有的li標籤
 

   for(var i=0;i<list.length;i++){//遍歷每一個li標籤

       list[i].setAttribute('index',i+1);  //給每一個li標籤新增索引
       list[i].onclick=function (  ) {
           alert("您點選了第"+this.getAttribute('index')+"個li標籤");//獲取新增的li標籤的元素值
       }
       }

方法二:使用閉包的方法

  var list=document.getElementById('ul1').children;
 
//獲取所有的li標籤
  for(var i=0;i<list.length;i++) {//遍歷每一個li標籤
      function outer (  ) {
          var num=i+1;
          function inner (  ) {
              alert("您點選了第"+num+"個li標籤");
          }
          return inner;
      }
//給每一個li標籤註冊單擊事件
      list[i].onclick=outer();
  }