链接:https://www.zhihu.com/question/20322273/answer/326741669
来源:知乎
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
</body>
<script>
var list=document.getElementsByTagName('li');
console.log(list)
// 1.
[].forEach.call(list,function(el,index){
el.οnclick=function(){
console.log(index+1)
}
})
// 2.
for(let i=0; i<list.length;i++){
list[i].οnclick=function(){
console.log(i+1)
}
}
// 3.
for(var i=0; i<list.length;i++){
(function(){
var p=i;
list[p].οnclick=function(){
console.log(p+1)
}
})()
}
// 4
for(var i=0;i<list.length;i++){
list[i].οnclick=function(){
var b=[].indexOf.call(list,this);
console.log(b+1)
}
}
// 5
for(var i=0;i<list.length;i++){
list[i].οnclick=function(){
console.log(this.innerHTML)
console.log(this.innerText)
console.log(this.textContent)
}
}
// 6.
for(var i=0;i<list.length;i++){
list[i].οnclick=function(){
var b;
for (var j=0;j<list.length;j++){
if(list[j]===this){
b=j
}
}
console.log(b+1)
}
}
</script>
</html>