ul>li点击li的时候，提示index值

1. js方法

// html
<ul id="test">
    <li>111</li>
    <li>222</li>
    <li>333</li>
    <li>444</li>
</ul>

// js:
window.function(){
    var ul=document.getElementById('test');
    var ul_lis=ul.getElementsByTagName('li');
    for (var i = 0;i < ul_lis.length; i++) {
        ul_lis[i].index = i; // 绑定一个变量，要不然i取最后的值！
        ul_lis[i].onclick=function(){
            console.log(this.index+1,this.innerHTML);
        }
    }
};

2. jquery：

// html：
<ul id="test">
    <li>第一个</li>
    <li>第二个</li>
    <li>第三个</li>
    <li>第四个</li>
</ul>

// js：
 var lis=$("#test>li");
 lis.click(function(){
     console.log($(this).index()+1,$(this).text());
 })

each循环：

var lis=$("#test>li");
$.each(lis,(k,v)=>{
    console.log(k,v);
})
lis.click(function(){
    console.log($(this).index()+1,$(this).text());
})
lis.each(function(k,v){
    console.log(k, v);
})

3. angular：

// html：
<ul id="test">
  <li *ngFor="let item of arr;index as i;" (click)="clickLi(item,i)">{{item.name}}</li>
</ul>

// js：
public arr = [
  {name:"第一个"},
  {name:"第二个"},
  {name:"第三个"},
];
clickLi(item,index){
  console.log(index,item);
}