javascript indexof()方法获取当前点击标签的索引问题

这几天在看别人写的某段代码的时候自己一直理解不了这个，希望得到解释，谢谢

html结构如下

<div onclick="getClickIndex(e)" id="result">
    <div>1</div>
    <div>3</div>
    <div>2</div>
    <div>3</div>
    <div>4</div>
    <div>8</div>
</div>

js 代码

var data=[1,3,2,3,4,8];//#result的数据来自这
function getClickIndex(e) {
    var node = e.target;
    var nodearr=node.parentNode.children
    var index= data.indexOf.call(nodearr, node);
    return index;
}

上面能返回点击的标签在#result 下的索引，主要是不明白 indexof.call()的结果为什么会是点击的那个索引,因为根据W3C 上面的解释，应该是返回第一次出现的索引。

下面是W3C的解释

首先谢谢各位的帮助，但是我还是有一点疑惑，indexof 是获取第一次出现的索引，当没有重复的元素还好理解，但是如上面的如果出现重复了他是怎么给indexof 第二个参数的检索位置的，其实那个检索位置就是索引吧。

因为你的node是e.target，是当前触发的元素

onclick="getClickIndex(event)",把event加上。

把函数改成这样就看得懂了：

function getClickIndex(e) {
  var node = e.target //目标div
  var nodeCollection = node.parentNode.children //所有子div的集合,类数组
  var nodeArr = Array.from(nodeCollection) //把类数组转成数组
  var index = nodeArr.indexOf(node) //拿到index
  return index;
}

nodeArr里面的元素都是不一样的节点，点击的节点也是唯一的，所以不会有重复。
你贴的那个图是字符串的indexOf方法，虽然用法和数组的基本一样，但是这里是在用Array.prototype.indexOf方法。

首先，这里就是Array的indexOf方法的使用，你看起来有些困惑估计是代码的写法问题。

你确定这段代码可以跑？按照下面的写法，在getIndexClick中的参数e应该是undefined，怎么去拿e.target?

onclick="getClickIndex()"

另外他就是要调用Array的indexOf，这样写感觉有困惑或者歧义，感觉index好像和data有关似得：

var data=[1,3,2,3,4,8];
//...
data.indexOf.call(nodearr, node);

完全可以这么写：

[].indexOf.call(nodearr, node);
// or
Array.prototype.indexOf.call(nodearr, node);
// or
var array = Array.prototype.slice.call(nodearr, 0); // 先转成数组
array.indexOf(node);    // 再调用数组的indexOf方法

你找的这个indexof是string的indexof，和代码里的不是同一个，代码里是调用了数组Array中的indexof, 这个函数是用来查找元素在数组中的位置的所以返回的是点击的元素的位置

【热门文章】

javascript indexof()方法 获取当前点击标签的索引问题

javascript indexof()方法获取当前点击标签的索引问题