removeAttribute не удаляет стиль CSS

#javascript #html #css

#javascript #HTML #css

Вопрос:

removeAttribute не удаляет «display: none;» в #hamburger-menu

JS:

 const hamburgerMenu = document.getElementById("hamburger-menu");
const hamburger = document.getElementById("hamburger");

hamburger.addEventListener('click', function() {
    hamburgerMenu.removeAttribute("display");
});
  

Комментарии:

1. Свойство «display» style относится к объекту элемента, а не к самому элементу.

Ответ №1:

Попробуйте hamburger.style.display = '' .

display это стиль элемента, а не атрибут.

Комментарии:

1. Я настоятельно рекомендую никогда не менять встроенные стили, если нет другого выбора. В некоторых случаях это делает дальнейшие изменения в стиле очень сложными — что-то, что должно занять 5 минут, а пара строк CSS превращается в час поиска, где устанавливается встроенный стиль.

Ответ №2:

Вместо удаления свойства отображения установите для него новое значение, например, block, flex и т. Д. На самом деле, обычно лучше переключать класс для изменения CSS. Поступая таким образом, вы можете очень легко управлять несколькими стилями.

 #hamburger-menu.visible {
    display: block;
}
  
 hamburger.addEventListener('click', () => {
    hamburgerMenu.classList.toggle("visible");
});