Как сделать, чтобы при нажатии на div1 появлялся на экране div2(div2 изначально скрыт), а при повторном нажатии div2 исчезал?

Question

Answer 1

Вариант на CSS

#block {
  display: none;
}

label[for="block"]::after {
  content: 'Показать блок';
  display: inline;
  color: green;
  cursor: pointer;
}

#block_hidden {
  display: none;
  background: gray;
  padding: 10px;
}

#block:checked ~ label[for="block"]::after {
  content: 'Спрятать блок';
  color: red;
}

#block:checked ~ #block_hidden {
  display: block;
}

<input type="checkbox" id="block">
<label for="block"></label>
<div id="block_hidden">Скрытый блок</div>

Answer 2

document.querySelector('.btn').addEventListener( 'click' , function(e) {
   e.target.classList.toggle('active');
   document.querySelector('.panel').classList.toggle('active');
});

Пример - http://www.jooom.ru/toster/vanilla10.php

БЛОГ НА HUSL

Как сделать, чтобы при нажатии на div1 появлялся на экране div2(div2 изначально скрыт), а при повторном нажатии div2 исчезал?

Ответы (2 шт):