第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

將課程傳遞給兩個導(dǎo)航欄

將課程傳遞給兩個導(dǎo)航欄

富國滬深 2021-05-03 09:41:30
我正在使用兩個導(dǎo)航欄。他們兩個都共享一個類(“ navbar-item”)。基本上,兩個導(dǎo)航欄都執(zhí)行相同的操作。例如導(dǎo)航欄1<a class="navbar-item" href="#Services">  <span class="icon"><i class="fas fa-clipboard-list"></i></span>  <span>Services</span></a><a class="navbar-item" href="#Delivery">  <span class="icon"><i class="fas fa-shipping-fast"></i></span>  <span>Delivery</span></a><a class="navbar-item" href="#Contact">  <span class="icon"><i class="fas fa-shipping-fast"></i></span>  <span>Contact</span></a>導(dǎo)航欄2<li class="navbar-item"><a href="#Services"></a></li><li class="navbar-item"><a href="#Delivery"></a></li><li class="navbar-item"><a href="#Contact"></a></li>我想在單擊時添加/刪除另一個類名(“當(dāng)前”)。我想將此新的類名(“當(dāng)前”)添加到兩個導(dǎo)航欄中。因此,當(dāng)單擊“服務(wù)”時,在兩個導(dǎo)航欄中,只有“服務(wù)”應(yīng)具有class current。單擊“交付”時,在兩個導(dǎo)航欄中,只有“交付”應(yīng)具有類current。我正在尋找一個純粹的js解決方案(沒有jQuery)。到目前為止,這就是我所擁有的。這會將新的類名(current)僅傳遞給第一個導(dǎo)航欄。var btns = document.getElementsByClassName("navbar-item");for (var i = 0; i < btns.length; i++) {  btns[i].addEventListener("click", function() {    var current = document.getElementsByClassName("current");    current[0].className = current[0].className.replace(" current", "");    this.className += " current";  });} 
查看完整描述

2 回答

?
繁星點點滴滴

TA貢獻(xiàn)1803條經(jīng)驗 獲得超3個贊

注意:-這是您可以根據(jù)選定元素切換(添加/刪除)類的檢測div的方法。


var div1 = document.getElementById("First");

div1.addEventListener("click", function (e) {

  if (event.currentTarget.classList.contains('active')) {

    event.currentTarget.classList.remove('active');

      var element = document.getElementById("Second");

      element.classList.add("active");

  } else {

    event.currentTarget.classList.add('active');

      var element = document.getElementById("Second");

      element.classList.remove("active");

  }

});

var div2 = document.getElementById("Second");

div2.addEventListener("click", function (e) {

  if (event.currentTarget.classList.contains('active')) {

    event.currentTarget.classList.remove('active');

    var element = document.getElementById("First");

      element.classList.add("active");

  } else {

    event.currentTarget.classList.add('active');

    var element = document.getElementById("First");

      element.classList.remove("active");

  }

});

.active{

 color:red;

}

<div id"newNav">

  <a class="navbar-item te" id="First" href="#Delivery">

  <span class="icon"><i class="fas fa-shipping-fast"></i></span>

  <span>Delivery</span>

  </a>

  <li class="navbar-item" id="Second"><a href="#Delivery"></a>

    <span>Delivery2</span>

  </li>

</div>


查看完整回答
反對 回復(fù) 2021-05-13
  • 2 回答
  • 0 關(guān)注
  • 152 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號