原生js——点击获取当前索引的方法

html代码部分

<button>A-1</button><button>B-2</button><button>C-3</button><button>D-4</button><button>E-5</button>

js代码部分

方法一：

//减少代码量

var btns = document.querySelectorAll('button');for(var i = 0;i < btns.length;i ++){(function(index){btns[index].onclick = function(e){console.log(index);}})(i);}

方法二：

//便于理解

var btns = document.querySelectorAll('button');for(var i = 0;i < btns.length;i ++){btns[i].onclick = function(){var index = searchIndex(this);console.log(index);}function searchIndex(navitem){for(var i=0;i<btns.length;i++){var index = -1;if(btns[i] == navitem){index = i;break;}}return index;}}