javascript - 我应该使用 addEventListener

Question

我应该addEventListener在这些类型的情况下使用吗？

<input id="input" type="file" onchange="fun()>

或者

document.getElementById("input").addEventListener("change", function() {
  fun();
});

为什么？

Answer 1

该onchange属性要求fun函数在全局范围内。在较大的应用程序中，您希望避免这种情况，因为您的应用程序或外部库中可能有其他同名的函数。或者想象构建一个在页面上多次使用的组件。

addEventListener可以像这样包裹在一个闭包中，并在一个孤立的组件中使用：

(function(){})(
    function fun(){
         // Now other components can also have a `fun` function, without causing confusion.
         // `fun` is only defined inside the IIFE (the (function(){})() wrapper around the module).
    }
    document.getElementById("input").addEventListener("change", function() {
      fun();
    });
);