&引用；涓流；自定义JavaScript事件

我正在研究JavaScript中的自定义事件

根据MDN，使用CustomEvent构造函数，可以选择使事件“冒泡”（默认为false）：

例如：

// add an appropriate event listener
obj.addEventListener("cat", function(e) { process(e.detail) });

// create and dispatch the event
var event = new CustomEvent("cat", {"detail":{"hazcheeseburger":true}});
obj.dispatchEvent(event);

我在JSFIDLE上测试了它：

泡泡功能似乎也能起作用。但我希望我的自定义事件是“滴流”，即触发子元素的侦听器；与冒泡相反

我隐约记得一些默认的浏览器事件“滴流”。这应该是早期浏览器的争论点之一

---

不管怎样，有没有办法在我的自定义事件上获得此功能？当然，任何相对简单直接的方法。我真的不想编写一个函数来遍历所有子元素并手动触发它们上的任何侦听器。我希望有另一种方法。

您正在寻找的行为称为

事件捕获

（与

事件冒泡

相反）。通过将

true

作为第三个参数传递给

addEventListener

，可以启用

事件捕获

见：

注意：
事件捕获
在IE 8或更低版本中不受支持

有关更多信息，请参阅：
谢谢。虽然一开始听起来确实是正确的答案，但这并不是我想要的。我的代码是“二”，“一”，你的代码是“一”，“二”。我想要的结果是“二”，“四”。无论如何，在任何情况下这听起来都很复杂，在我的情况下，我认为最简单的解决方案是一个自定义“事件总线”，我可以将侦听器挂接到该总线上并触发自定义事件。@Rolf你的意思是让
四个
成为
两个
的孩子吗？无论哪种方式，在使用
事件捕获时将事件绑定到
document.querySelector（“#two*”）
是否有效？这将击中
一个
，
两个
，和
四个
。然后，您可以检查处理程序的内部，查看
event.target
是否是
event.currentTarget
的父级。如果是，则事件为“有效”。如果不是，则为“无效”，应忽略。这将使您只获得
2个
和
4个
。更正：然后您可以检查处理程序内部，查看
2个
是否是
e.currentTarget的父级或等于
e.currentTarget
。如果是，则事件为“有效”。如果不是，则为“无效”，应忽略。e、 g.：（显然，这可以被重构得更干净）我想让事件在子节点上“滴流”。我认为这会发生在一些默认事件中。我放弃了定制事件的滴流式或气泡式处理，只使用“事件总线”类在全局范围内注册和触发我的定制事件，而不用太担心事件传播。我认为它具有您描述的功能。