一个 DOMContentLoaded 事件侦听器还是多个？

问题描述

我应该只创建一个 DOMContentLoaded 事件侦听器并收集内部所有元素的所有内容，还是可以为每个元素编写多个 DOMContentLoaded 侦听器？

这个：

    window.document.addEventListener('DOMContentLoaded',function() {
        var elems = document.querySelectorAll('.sidenav');
        var instances = M.Sidenav.init(elems,{edge:'right'});
    });

    window.document.addEventListener('DOMContentLoaded',function() {
        var elems = document.querySelectorAll('.collapsible');
        var instances = M.Collapsible.init(elems,{"accordion" : false});
    });

或者这个：

    window.document.addEventListener('DOMContentLoaded',{edge:'right'});
        var elems2 = document.querySelectorAll('.collapsible');
        var instances2 = M.Collapsible.init(elems2,{"accordion" : false});
    });

哪个更正确？对 DOMContentLoaded 事件使用多个函数是否有任何警告？一个会覆盖另一个，还是他们都被保存并在以后被解雇？

现在我把它们分别放在不同的功能中，对我来说更方便，但我不知道它是否正确。谢谢。

解决方法

通过将它放在一个侦听器函数中，您可以减少代码的碎片化，提高可读性，并避免下一个开发人员“修复”第一个侦听器中实际上已经存在于第二个侦听器中的缺失调用的情况.

如果您有多个源文件用于单个显示页面（例如将 MVC 共享视图加载到父视图中），您可能会发现在多个文件中拥有一个侦听器是合乎逻辑且必要的。