jQuery 延迟后加载 jQuery 插件文件答案

【问题标题】：load jquery plugin file after jQuery defferedjQuery 延迟后加载 jQuery 插件文件
【发布时间】：2018-11-08 14:08:59
【问题描述】：

我有一个 js 文件，我想在 Jquery 延迟函数之后加载它。事情是我在 getData 函数中引入数据，然后将字符串注入 DOM。之后，js 文件将初始化该代码。这就是我想在我的代码运行后调用 js 文件的原因

我该怎么做

下面是我的代码。

jQuery 函数声明

function getData(url) {
  return $.ajax({
    url: url,
    method: 'GET',
    headers: {
      Accept: 'application/json; odata=verbose',
    },
  })
}

函数调用

getData(url).then(function(data){

});

现在我想在 then 函数结束后调用 jQuery 文件。

<script src="file.js"></script>

【问题讨论】：

你为什么要这么做？
@IslamElshobokshy 好问题。事情是我将数据带入我的 getData 函数，然后加载。所以js会初始化那个代码。这就是这样做的原因
Dynamically load JS inside JS的可能重复

标签： javascript jquery jquery-deferred

【解决方案1】：

你需要使用 Promise/await 的方式，因为你需要在执行完某事后写入 js 文件，这样你就可以让 js 文件等到你的代码完成，然后将你的新 js 文件写入 body....check这个例子：

/* MEthod used to write js to body script */
function addJsFileToBody(jsSrc)
{
    var script = document.createElement("script");
        script.src = jsSrc;
        document.getElementsByTagName("body")[0].appendChild(script);
}

var promise1 = new Promise(function(resolve, reject) {
  $.ajax({
    url: url,
    method: 'GET',
    headers: {
      Accept: 'application/json; odata=verbose',
    },
    complete: function(data) {
      resolve(data);
    }
  })
});

promise1.then(function(value) {
  addJsFileToBody('file.js');
});

参考和示例： Promise 和 await

【讨论】：