JavaScript通过类或ID获取元素在DOM数组中的索引位置

Question

我的情况

var domElements = document.body.getElementsByTagName('*');

现在我想返回数组项键-元素在数组中的位置（例如domElements [34]），在数组中搜索具有id =" asd "的元素。

我如何实现这一点？

如果不是ID，而是要搜索class ="asd hey"怎么办？

非常感谢您的任何帮助！

注：不使用jquery，在这种情况下我需要使用纯javascript。

- itsme

---

@fuyushimoya 不好意思，我需要纯JS，请看更新后的问题。 :P - itsme

请查看此链接：http://jsfiddle.net/kb3621gb/1/ - Newinjava

Answer 1

试试这样做

var matches = document.querySelectorAll("#asd");

如果您想按类进行搜索。

var matches = document.querySelectorAll(".asd");

如果你想要代码的索引，可以尝试以下方式：

var domElements = document.body.getElementsByTagName('*');

for(var i=0;i<domElements.length;i++){
   if(domElements[i].id==="asd"){
      // search by id 
      // index i 
   }
   if(domElements[i].className==="asd"){
      // search by class 
      // index i 
   }
}

编辑

你可以以另一种方式查找索引。

试试这样做：

var domElements = document.body.getElementsByTagName('*');
var domList= Array.prototype.slice.call(document.body.getElementsByTagName('*'));
var itemList = Array.prototype.slice.call(document.querySelectorAll(".asd"));
console.log(domList.indexOf(itemList[0])) // if you wanna find one index

//if you wanna search all index of class 

for(var i=0;i<itemList.length;i++)
  console.log(domList.indexOf(itemList[i]))

- Anik Islam Abhi

---

抱歉，但我需要返回domElements数组中的位置，我无法直接执行此操作。 - itsme

位置意味着什么？索引是什么？ - Anik Islam Abhi

谢谢你，我会再等一下看看是否有更好的解决方案，否则我会接受你的，谢谢！！ - itsme

@sbaaaang，我又添加了一种方法，请尝试一下 :) - Anik Islam Abhi

Answer 2

不是字面上的代码，但如果您遍历dom元素。

for (var i = 0; i < parentElement.children.length; i++) {
    var item = parentElement.children[i];
    if (item.getAttribute('id') === 'asd') {
        return i;
    }
}

这里的假设是，你不需要选择所有的DOM元素，只需选择你的元素列表的parentElement - 这种方法更加合理，而且效率也更高。

- Alex

Answer 3

我想您是在问这个：

var li = document.querySelectorAll("li");
function cutlistitem(lielm) {
lielm.addEventListener("click", function () {
    lielm.classList.toggle("done")
})
};
li.forEach(cutlistitem);

我正在创建一个待办事项应用程序，在其中我创建了一个任务的无序列表，在该 `

` 中，每个任务都在 `
• ` 中。
  
  现在我想要的是：为每个 `li` 元素添加事件侦听器，因此我需要获取 `li` 列表中的每个元素。我对 `li` 列表中的每个元素运行了一个 `forEach` 循环，并向每个元素添加了一个事件侦听器。要获取元素的索引，可以使用 `indexOf` 方法。

- Ali Ahmed Khan

Answer 4

最简单的方法

var list = [].slice.call(document.querySelectorAll('.class-name'));
var listIndex = list.filter(function(el, index){
    if(el.id === 'id'){
       return index;
    }
})

- anotherRandomGuy