[0]和getElementsByClassName上所有循环之间的中间地带

Middle ground between [0] and loop through all on getElementsByClassName

本文关键字：循环 之间 中间地带 getElementsByClassName      更新时间：2023-09-26

我有一个代码，它最初只会激活ElementsByClassName（"thishere"）的第一次出现，即使文档中后来出现的内容被点击。

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

所做的更改（见下文）意味着当单击任何ElementsByClassName（"thishere"）时，它可以循环通过所有元素ByClassName；我希望只激活被单击的元素的特定引用，而不是同时激活所有引用。

我的专业知识非常有限，所以我希望我使用了正确的术语并提供了相关信息。非常感谢您的帮助。

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;
}

下面是使用的HTML：

<div><a href="stackoverflow.com" target="_blank" rel="follow" onClick="zxcv(this)">Stackoverflow</a><div class="thishere" style="display:none;">On Your Way To Expert Help</div>

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

据我所知，for... in只适用于JavaScript对象。

试试这个：

HTML:

<div class="thishere">
<h1 style="display:none;">CleverPeople</h1>
<a href="stackoverflow.com" target="_blank" rel="follow">www.Stackoverflow.com</a>
</div>
<div class="thishere">
<h1  style="display:none;">MoreCleverPeople</h1>
<a href="stackoverflow.com" target="_blank" rel="follow">www.Stackoverflowmore.com</a>
</div>

JS:

   $('document').ready(function(){
     $('.thishere').on('click',function(e){
     $(this).find('a').hide();
     $(this).find('h1').show();
     //return false;
    })
  });
相关文章：