クリック時のDIVの表示を切り替えます

Question

私は百万のdiv要素を持っています。

私は、以下の機能を実現したい：私はdiv vsibileをクリックすると

1. 、それが消えます。

2. 私はdivをクリック

   、見えない再表示された任意のdiv。

例：あなたは100万個のdiv要素を持っている理由

<div>1</div> <!-- Invisible div --> 
<div>2</div> 
<div>3</div> 
<div>4</div> 
<div>5</div> 
<div>6</div> <!-- Currently visible. On click, div 1 becomes visible and this becomes invisible--> 
... 1.000.000 

Answer 1

prev = false; 
 

 
document.querySelectorAll("#test div").forEach(function(a,i){ 
 
    a.index = i; 
 
    a.addEventListener("click",function(){ 
 
    if (prev !== false) document.querySelectorAll("#test div")[prev].style.opacity = 1; 
 
    this.style.opacity = 0; 
 
    prev = this.index; 
 
})});

#test * { 
 
    width: 60px; 
 
    height: 60px; 
 
    margin: 10px; 
 
    background-color: green; 
 
}

<div id="test"> 
 
    <div></div> 
 
    <div></div> 
 
    <div></div> 
 
    <div></div> 
 
</div>