[已解决]如何变量数组中根据class类名获取序号

只是那个人

<ul class="process-nav">
                <li class="process P">( P )</li>
                <li class="process W">( W )</li>
                <li class="process T">( T )</li>
                <li class="process A">( A )</li>
                <li class="process R">( R )</li>
                <li class="process I">( I )</li>
                <li class="process L">( L )</li>
              </ul>

我有以上HTML

 var process = document.querySelectorAll(".process")

我在JS中根据class获取了一个数组变量

现在我想根据class类名获取对应数组序号应该怎么书写

举例如果我想获得class="process R“它在process变量中的序号

我自己书写的代码是console.log(process.indexOf("process.W"))但是不对

最佳答案

月排行榜 / 总排行榜

FishC

2024-3-11 10:53:57

你可以使用classList属性获取元素的类名列表，然后遍历数组进行比对，找到匹配的类名并返回序号。代码示例如下：

var process = document.querySelectorAll(".process");
var targetClass = "R";
var index = -1;

for (var i = 0; i < process.length; i++) {
  if (process[i].classList.contains(targetClass)) {
    index = i;
    break; // 找到匹配的类名后跳出循环
  }
}

console.log(index);

在这个例子中，我们首先定义了一个目标类名`targetClass`，然后通过遍历`process`数组，使用`classList.contains()`方法检查每个元素是否包含该类名，如果找到匹配的类名，就将对应的索引值赋给`index`变量，并使用`break`语句跳出循环。最后，我们通过`console.log()`输出`index`的值来得到所需的序号。

希望能帮助到你！

以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。

跳转到最佳答案楼层

FishC

你可以使用classList属性获取元素的类名列表，然后遍历数组进行比对，找到匹配的类名并返回序号。代码示例如下：

var process = document.querySelectorAll(".process");
var targetClass = "R";
var index = -1;

for (var i = 0; i < process.length; i++) {
  if (process[i].classList.contains(targetClass)) {
    index = i;
    break; // 找到匹配的类名后跳出循环
  }
}

console.log(index);

在这个例子中，我们首先定义了一个目标类名`targetClass`，然后通过遍历`process`数组，使用`classList.contains()`方法检查每个元素是否包含该类名，如果找到匹配的类名，就将对应的索引值赋给`index`变量，并使用`break`语句跳出循环。最后，我们通过`console.log()`输出`index`的值来得到所需的序号。

希望能帮助到你！

以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。