在 REST API 之后将 JavaScript 加载到 HTML 中

Question

我正在查看一个较旧的 html/jquery webapp，我需要更改它。最初编写代码的方式是通过 Spring MVC。HTML 页面将调用 Servlet，然后将 HTML 返回给客户端/浏览器。这个“mypage.html”有几个加载的JS文件：

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

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

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

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

因此，当页面返回到浏览器时，HTML 页面已经替换了值，然后 JS 会添加这些知道如何处理数据的脚本。

我替换它的方式，摆脱了 MVC 概念，并以不同的方式处理这个问题。就我而言，一个页面调用 iFrame 中的另一个 HTML。加载 iframe 后，它会进行 Ajax/REST 调用以从后端获取数据……因为我们是这样做的，所以加载了 4 个 javascript 文件，但没有它们需要的数据，因为它还没有，所以我认为它有点竞争条件。

所以，如果我做类似的事情......

$.ajax({

        type : 'POST',

        url : api_root + '/backed/api/mydataapi',

        contentType : 'application/json',

        dataType : 'json',

        data : JSON.stringify({

            queryid : queryId,

            token : tokenX

        }),

        success : function(data) {

            data1 = data.environment.data1;

            data2 = data.environment.data2;

            data3 = data.environment.data3;

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

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

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

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

        }

我不认为它有效，但这就是我的目标。如果有更好的方法将这些 JS 文件添加到页面中，但只有在成功进行 REST 调用之后。我更像是一个在 Spring 中创建 RESTful API 的后端人员。我不是一个 javascript 人，也不是很多年了。我的雇主想在 ReactJS 中重做整个 UI，但我们还没有。在此期间，我必须处理这个半过程。

Answer 1

你可以使用$.getScript().如果加载顺序很重要，则需要稍微调整一下，因为请求是异步的，并且无法以这种方式保证完成顺序&nbsp;success : function(data) {&nbsp; &nbsp; &nbsp; &nbsp; data1 = data.environment.data1;&nbsp; &nbsp; &nbsp; &nbsp; data2 = data.environment.data2;&nbsp; &nbsp; &nbsp; &nbsp; data3 = data.environment.data3;&nbsp; &nbsp; &nbsp; &nbsp;$.getScript("js/file1.js");&nbsp; &nbsp; &nbsp; &nbsp;$.getScript("js/file2.js");&nbsp; &nbsp; &nbsp; &nbsp;....&nbsp; &nbsp; }