как закрыть созданный div, нажав за его пределами?

Question

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

closediv();

    }

function closediv() {

    document.addEventListener("click", (evt) => {
        const maindiv = document.getElementById('div3');
        let targetElement = evt.target;

        do {
            if (targetElement == maindiv.childNodes[1]) {
                return;
            }

            targetElement = targetElement.parentNode;

        } while (targetElement);

        var viewpost = maindiv.childNodes[1];

        viewpost.parentNode.removeChild(viewpost);
    });


}

Answer 1

---

просто добавьте событие щелчка на теле, чтобы закрыть ваш div, а затем добавьте предотвращение по умолчанию в ваш div, чтобы заблокировать закрывающее действие, когда пользователь нажимает на ваш div

document.body.addEventListener('click', (e) =>{
  //close your div here
 })
document.addEventListener("click", (evt) => {
   evt.preventDefault()
   // your code
}

Answer 2

В вашем обработчике нажатий кнопок вы можете использовать

theButton.addEventListener("click", function(ev) {
  ev.stopPropagation();
  // rest of the code

});

, и событие нажатия не будет распространяться на родительские контейнеры .