javascript - 动态加载脚本加载后未定义

Question

当添加动态加载的脚本时，我可以在执行期间访问主对象，但是一旦加载页面，如果我尝试从控制台访问它，它会抛出未定义的错误。例如，

 var js, fjs = d.getElementsByTagName('script')[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id;
     js.src = "//connect.facebook.net/en_US/all.js";
 js.onload = ()=> { /* do something when script loads */}
 fjs.parentNode.insertBefore(js, fjs);

理想情况下，这应该将 FB 对象附加到窗口，并且它在页面执行期间执行此操作。当上述JS执行时，我可以访问window.FB，但是一旦页面加载(并且我知道js.onload也被执行)，我就无法访问FB.someOperation。

确保动态添加的脚本始终可用(即使在页面加载后)的解决方案是什么

Answer 1

记住double check the property names .

onLoad 应为 onload(全部小写)。

var d = document;
var id = 'hello';
var js, fjs = d.getElementsByTagName('script')[0];
js = d.createElement('script');
js.id = id;
js.src = "//connect.facebook.net/en_US/all.js";

js.onload = () => {
//   ^--------------------------- note the lowercase 'l'
  console.log('hello world');
};

fjs.parentNode.insertBefore(js, fjs);

<script></script>