Javascript stopPropagation

Question

我只是在学习，所以代码可能不是最好的。我在其他答案中尝试了几个例子，但我被困在这里了。

Function invisibleDiv(){  
  var invDiv = document.createElement('div');  
  var secondDiv = document.createElement('div');  
  secondDiv.setAttribute('class', 'secondDiv');
  document.body.appendChild(invDiv);
  invDiv.appendChild(secondDiv);
};

我有一个jQuery代码：

$(document).on("click", ".secondDiv", function (e){
    e.stopPropagation();
});

所有这些都是可行的，但是我试图用纯Javascript替换我的所有jQuery函数，所以我尝试了如下：

document.addEventListener("DOMContentLoaded", function(event) {
  var secondDiv = document.querySelector('.secondDiv').
  div.addEventListener('click', function(e) {
    e.stopPropagation; // Not working
    secondDiv.stopPropagation; // Not working
  }
});

我尝试将事件侦听器添加到函数invisibleDiv中，在DevTools中可以看到事件是附加的，但是当单击secondDiv仍然会触发invisibleDiv中的事件。

我可以让它工作，将两个div添加到html代码中，并显示: none/block，但是由于它与动态添加的jQuery一起工作，所以我想知道我做错了什么。

Answer 1

更新：

基于你上面的评论，在我看来，你似乎是在寻找这样的东西：

  var outer = document.querySelector('.outer');
  var inner = document.querySelector('.inner');

  outer.addEventListener('click', function(e) {
      console.log("Outer clicked");
  });

 inner.addEventListener('click', function(e) {
     e.stopPropagation();
 });

http://jsfiddle.net/j9a0nsto/

看来你不是在调用这个函数。

JavaScript中的函数是通过使用()括号执行的，因此您的代码如下：

e.stopPropagation();和secondDiv.stopPropagation();

对secondDiv.stopPropagation()的调用是多余的，因为元素对象没有该函数，需要删除。