Как скрыть элемент Div при нажатии с помощью JavaScript?

Чтобы скрыть элемент

при нажатии в любом месте страницы с помощью JavaScript, вы можете использовать различные методы. Вот несколько подходов:

  1. Метод 1: прослушиватель событий в теле документа

    document.body.addEventListener('click', function() {
 var div = document.getElementById('yourDivId');
 div.style.display = 'none';
});

    В этом методе в тело документа добавляется прослушиватель событий, и при возникновении события щелчка он скрывает

    с указанным идентификатором, устанавливая его displayприсвоено значение 'none'.

  2. Метод 2: прослушиватель событий в окне

    window.addEventListener('click', function(event) {
 var div = document.getElementById('yourDivId');
 if (!div.contains(event.target)) {
   div.style.display = 'none';
 }
});

    С помощью этого метода к окну прикрепляется прослушиватель событий щелчка. Когда запускается событие щелчка, оно проверяет, находится ли выбранный элемент внутри указанного

    . Если нет, он скрывает

    .

  3. Метод 3. Всплеск событий

    document.addEventListener('click', function(event) {
 if (!event.target.closest('#yourDivId')) {
   var div = document.getElementById('yourDivId');
   div.style.display = 'none';
 }
});

    Этот метод использует всплытие событий, при котором событие клика фиксируется на уровне документа. Он проверяет, соответствует ли выбранный элемент или любой из его предков указанному

    , используя метод closest(). Если нет, он скрывает

    .