Question

我想在点击链接时删除上层元素的类：

＆＃13;

var icon_burger = document.querySelector(".page-header__logo-link--burger");
var logo_link = document.querySelector(".page-header__logo-link");
var icon_cross = document.querySelector(".page-header__icon-closed");
var main_nav = document.querySelector(".main-nav");
var link_cross = document.querySelector(".page-header__logo-link--closed");

icon_burger.addEventListener("click", function (event) {
  event.preventDefault();
  main_nav.classList.remove(".hidden-devices");
  link_cross.remove(".hidden-devices");
});

＆＃13;

.hidden-devices {
  display: none;
}

＆＃13;

<header class="page-header">
  <div class="wrapper-flex">
    <nav class="main-nav main-nav--nojs hidden-devices">
      <button class="main-nav__toggle">
      </button>
      <ul class="main-nav__list site-list">
        <li class="main-nav__items"><a>Главная</a></li>
        <li class="main-nav__items"><a href="#">Фотографии</a></li>
        <li class="main-nav__items"><a href="#">Конкурс</a></li>
        <li class="main-nav__items"><a href="#">Lolkekcheburek</a></li>
      </ul>
      <a href="#" class="main-nav__toggle main-nav__toggle--close"></a>
    </nav>
  </div>
  <div class="page-header__nav-wrap">
    <a href="/" class="page-header__logo-link">
     </a>
    <a class="page-header__logo-link page-header__logo-link--burger">
      <svg class="page-header__icon-burger">
        <use xlink:href="#img--svg--icon-menu-burger"></use>
      </svg>
    </a>
     <a class="page-header__logo-link page-header__logo-link--closed hidden-devices" href="#">
      <svg class="page-header__icon-closed">
        <use xlink:href="#img--svg--icon-menu-cross"></use>
      </svg>
    </a>
    </div>
    </header>

＆＃13;

现在它不起作用。我认为这是因为main-nav的结构比.page-header__logo-link - burger高。但我不确定我的推测是否正确。如何删除.hidden-devices类？

Answer 1

您的classList.remove来电中的班级名称存在问题。试试这个：

icon_burger.addEventListener("click", function (event) {
  event.preventDefault()
  main_nav.classList.remove("hidden-devices")
  link_cross.remove("hidden-devices")
})

你不应该拥有'。'在这种情况下的类名。你只在编写选择器时才这样做。 classList.remove期望一个字符串是类名，而不是选择器。

从上层元素中删除元素类

1 个答案: