从 getElementsByClassName 中删除 [0]

Question

我正在尝试从下面删除 [0]，而是用迭代替换，这似乎是另一个 post here

上的解决方案

但是我的知识非常有限，所以这可能不是解决方案或需要变体。单击时调用该函数，我只是在寻找被单击以激活的元素。例如，如果出现两次 "thishere"，则只会调用被单击的事件。

如有任何帮助，我们将不胜感激。

function zxcv(el) {
    el.style.display = "none";
    el.parentNode.parentNode.getElementsByClassName("thishere")[0].style.display = 'block';
    return false;
}

Answer 1

写个循环就行了

function zxcv(el) {
    el.style.display = "none";
    var elements = el.parentNode.parentNode.getElementsByClassName("thishere");
    for(var i in elements) {
           elements[i].style.display = 'block';
    }
    return false;
}

编辑

正如我们在评论中所说，要仅激活 onclick 你可以这样做：

    function zxcv(el) {
      // catch element and set display block
        el.style.display = "block";
        return false;
    }


    var elements = document.getElementsByClassName("thishere");
    for(var i in elements) {
      // we hide all elements
      elements[i].style.display = "none";
      // we handled the click event
      elements[i].click(function(e) {
        // we call zxcv with the element as parameter
        zxcv(this);
      });
    }

Answer 2

听起来您想对所有个匹配元素应用相同的样式？

如果是：

function zxcv(el) {
  el.style.display = "none";

  var els = el.parentNode.parentNode.getElementsByClassName("thishere");

  for ( var i = 0; i < els.length; ++i )
    els[i].style.display = 'block';

  return false;
}

Answer 3

其中一种方式：

function zxcv(el) {
    el.style.display = "none";        
    el.parentNode.parentNode.getElementsByClassName("thishere").forEach(function(i, elem){
        elem.style.display = 'block';
    });
    return false;
}

有几种方法可以遍历数组：

Answer 4

您只需要设置一个类似于您发布的问答的循环。

步骤：

获取一个数组，其中包含 class 名称为 thishere
的所有元素
var elements = el.parentNode.parentNode.getElementsByClassName('thishere');
创建循环遍历元素数组中的每个元素

for(var i in elements) { elements[i].style.display = 'block'; }

对于上面的循环，var i 初始化一个变量，该变量将用于遍历 elements 数组。然后使用 i 作为数组 elements

中元素的索引

Answer 5

只需遍历元素并将样式应用于第 [0] 个元素。

function zxcv(el) {
el.style.display = "none";
var elements = el.parentNode.parentNode.getElementsByClassName("thishere");
for( var i = 0; i < els.length; ++i ) {
       if(i===0)
       {
            elements[i].style.display = 'block';
            break;
       }
}
return false;}

从 getElementsByClassName 中删除 [0]

Remove [0] from getElementsByClassName

javascript

getelementsbyclassname

编辑