0

我只需要为 IE加载babel-polyfill 。还需要让 IE 等待并且不要执行console.log('Checkpoint 2');它下面的代码（包括IeOnlyPolyfillTest.js），直到babel- polyfill将从外部资源完全加载。

 <body>
  <script type="text/javascript">

    var userAgent = window.navigator.userAgent;
    var isInternetExplorer = userAgent.indexOf('Trident/') > 0 || userAgent.indexOf('MSIE ') > 0;

    if (isInternetExplorer) {
      var htmlDocumentHead = document.getElementsByTagName('head')[0];
      var babelPolyfillScript = document.createElement('script');
      babelPolyfillScript.type = 'text/javascript';
      babelPolyfillScript.src = 'https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/7.0.0-rc.1/polyfill.min.js';
      console.log('Checkpoint 1');
      htmlDocumentHead.appendChild(babelPolyfillScript);
      console.log('Checkpoint 2');
    }

  </script>
  <script type="text/javascript" src="scripts/IeOnlyPolyfillTest.js"></script>
</body>

和IeOnlyPolyfillTest.js部分：

(function launchApplication() {
  console.log('Checkpoint 3');
  testSymbolFeature();
})();

function testSymbolFeature() {
  let symbolTest = Symbol('foo');
  console.log(`Symbol feature is working! ${symbolTest.toString()}`);
}

首先，我不能添加async="false"属性：

babelPolyfillScript.async = false; // no effect
babelPolyfillScript.async = 'false'; // async="" will be generated

我尝试了以下解决方案（原始答案）：

var script = document.createElement("script");
script.src = "script.js";
console.log("a");
document.body.appendChild(script);
console.log("b");

在我的情况下，日志顺序也总是正确的，但是如果有时重新加载页面，我们会随机得到有错误的案例和没有错误的案例（换句话说，错误条件不清楚，并且会逐案发生）：

坏情况：

在此处输入图像描述

好案例：

在此处输入图像描述

那么，我们可以做些什么来让console.log('Checkpoint 2');下面的所有脚本等到babel-polyfill完全加载？

4

0 回答 0