如何切換兩種元素同時使用純JS

Question

我試圖找出如何切換在同一時間兩個要素：

一個要素消失，在同時另一變淡出的正常工作，但我也需要改變/添加一個類到另一個元素。基本上我有一個隱藏和顯示DIV的導航菜單，但我也需要突出顯示鏈接，並在純香草JavaScript中完成。我想[希望]使用element.toggle類來執行它。

任何幫助表示讚賞。

HTML：

<div> 
    <section class="" id="home"> 
     <p>...Stuff</p> 
    </section> 

    <section class="" id="about"> 
     <p>...Stuff</p> 
    </section> 

    <section class="" id="contact"> 
     <p>...Stuff</p> 
    </section> 

    <div> 
     <a href="javascript:toggle('home', 'home-btn')" id="home-lnk" class="active">Home</a> 
     <a href="javascript:toggle('about', 'about-btn')" id="about-lnk">About</a> 
     <a href="javascript:toggle('contact', 'contact-btn')" id="contact-lnk">Contact</a> 
    </div> 
</div> 

的JavaScript： 編輯：目前div的切換，但鏈接凸顯了錯誤的鏈接

<script type="text/javascript"> 

    var divs = [ "home", "about", "contact" ]; 
    var lnks = [ "home-lnk", "about-lnk", "contact-lnk" ] 

    function toggle(layer) { 
     var d, l 
     for(var i = 0; i < divs.length && lnks.length; i += 1) { 

      d = document.getElementById(divs[i]); 
      d.style.opacity = '0'; 

      l = document.getElementById(lnks[i]); 
      l.className = ''; 
     } 

     d = document.getElementById(layer); 
     d.style.transition = 'opacity 1s'; 
     d.style.opacity = '1'; 

     l = document.getElementById(lnks[i]); 
     l.className += 'active'; 
    } 

</script> 

Answer 1

輕鬆！

我後失蹤分號：

var lnks = [ "home-lnk", "about-lnk", "contact-lnk" ];