javascript - 忽略 div 内的所有事件

Question

假设我有这个 div:

let div = document.createElement('div');
div.id = 'foobar';
div.innerHTML = '<button>foo</button>';
document.body.insertBefore(div, document.body.firstChild);

我也用

 window.addEventListener('click', function(event){
    // I want to ignore any events 
    // originating from within the div with id = 'foobar'  
 });

如评论中所述，我想忽略源自 id = 'foobar' 的 div 内的任何事件，我该怎么做？

Answer 1

使用Node.prototype.contains，这似乎有效:

window.addEventListener('click', function (ev) {

    if (ev.target == div) {
      console.log('we can ignore this event...because its from the modal.');
      return;
    }


    let contains = div.contains(ev.target);
    if (contains) {
       console.log('we can ignore this event...because its from a child in the modal.');
       return;
    }

 });