Question

正如我在主题中所说，当我尝试查找某些元素的索引时，该元素是由具有公共类名的元素创建的，其代码为：document.getELementsByClassName（＆＃34; blabla＆＃34;）。

＆＃13;

var a, b, pe;
    a=document.getElementById("a");    
    b=document.getElementById("b");
    pe=document.getElementsByClassName("o");
    var k=pe.indexOf(b);
    alert(k);

＆＃13;

<p class="o" id="a"></p>
<p class="o" id="b"></p>

＆＃13;

Answer 1

许多人指出document.getElementsByClassName("myclass");返回NodeList而不是数组。因此，您无法利用indexOf或forEach等原生数组方法。来自docs：

NodeList像数组一样使用非常，并且很容易对它们使用Array.prototype方法，但是它们没有这些方法.JavaScript有一个基于原型的继承机制内置对象（如Arrays）和宿主对象（如NodeLists）。数组实例继承数组方法（例如forEach或map），因为它们的原型链如下所示：

myArray --> Array.prototype --> Object.prototype --> null (The prototype chain of an object can be obtained by calling Object.getPrototypeOf several times.)

那就是说，你基本上想要将NodeList转换为数组。你可以这样做：

var turnObjToArray = function(obj) {
  return [].map.call(obj, function(element) {
   return element;
 })
};

var a=document.getElementById("a");    
var b=document.getElementById("b");
var pe=document.getElementsByClassName("o");
var listBox = turnObjToArray(pe);
console.log(listBox);
alert(listBox.indexOf(a)); //Normal array methods can be used here.

DEMO

希望它能让你开始朝着正确的方向前进。

Answer 2

这个过程可以通过多种方式完成，但按照我的说法，您也可以按照以下方式执行此操作，但我仍然建议使用jquery。我只是在这里写下你能理解的代码，

我使用querySelectorAll返回所有具有类o的元素。因为所有浏览器都不支持getElementByClass名称：请检查此链接：getElementByClass not support in IE8

遍历所有匹配对象。

var a=document.getElementById("a");    
var b=document.getElementById("b");
var v=document.getElementById("v");
var pe=document.querySelectorAll('.o');
for( i in pe)
{
    if(v == pe[i])
    {
        alert("found index "+i);
    }
}

<p class="o" id="a"></p>
<p class="o" id="b"></p>
<p class="o" id="v"></p>

Answer 3

由于getElementsByClassName返回的对象是＆＃34;数组类似＆＃34;你可以做到以下几点：

var k = Array.prototype.indexOf.call(pe,b);

因为pe是＆＃34;数组类似＆＃34;，indexOf将起作用，但您必须直接从Array.prototype调用indexOf，然后使用{{设置调用对象（this） 3}}

从getElementsByClassName返回的对象是HTMLCollection。要了解您可以对此对象执行的操作，可以查看.call。

未来提示：在Chrome中按F12或右键单击任何元素，然后选择＆＃34;检查元素＆＃34;。这将打开开发工具，在控制台选项卡中您将看到错误。

您可能已经看到pe没有名为indexOf的函数，因为它不是Array的实例，而indexOf在Array.prototype上。

有关原型和构造函数的更多信息（Array是本机构造函数）following documentation。

访问具有公共类名的元素数组中的元素索引

3 个答案: