JavaScript - nubie、window.onload 和 IIFE

Question

我这里有一个骗子 - https://plnkr.co/edit/RZTF9uda8Cw2YQx8Gs1Y?p=preview

这是按钮上的一个简单事件

使用 window.onload 可以工作，但不能使用 IIFE。

我认为 IIFE 一旦创建就会运行，所以这不像窗口加载后那样吗？

    // (function(){

    //   var btn = document.getElementById('btn1');

    //   btn.addEventListener('click', function(){
    //     alert('Hi');
    //   })

    // })();


    window.onload = function(){

      var btn = document.getElementById('btn2');

      btn.addEventListener('click', function(){
        alert('Hi');
      })

    };

Answer 1

I thought the IIFE would run once its created

是的，当然。 (这已经在名字里了……)

so is that not like once the window has loaded?

这就是问题。

您的脚本资源嵌入在头部，这意味着在执行它时，您尝试通过其 id 选择的 HTML 元素尚不存在。

因此，您要么需要在元素存在后执行此操作(窗口加载、DOMContentReady)，要么在相关 HTML 元素之后嵌入外部脚本资源。 (无论如何，将脚本放在正文末尾是一般性能建议。)