JS Promise.all 准备好文档答案

【问题标题】：JS Promise.all with document readyJS Promise.all 准备好文档
【发布时间】：2021-01-07 16:10:43
【问题描述】：

我需要获取一些数据的 json 文件，并等待 dom 加载（并使用 json 填充表）。有没有办法同时做这两个？这就是我现在所拥有的。显然，它很慢，因为它等待 dom，然后是 get。

$(document).ready(() => {
    $.get(..., callback)
})

【问题讨论】：

标签： javascript jquery asynchronous promise

【解决方案1】：

你可以在什么时候使用

var d1 = $.Deferred();
var d2 = $.get(...)

$(document).ready(() => {
  d1.resolve();
})

$.when( d1, d2 ).done(function ( v1, v2 ) {
  console.log(v2);
});

但是在 ready 中使用 done() 和 get 调用会更有意义

var jqxhr = $.get( "example.php", function() {
  alert( "success" );
});

$(document).ready(() => {
  jqxhr.done(function() {
    alert( "second success" );
  })
  .fail(function() {
    alert( "error" );
  })
  .always(function() {
    alert( "finished" );
  });
});

【讨论】：

【解决方案2】：

jQuery AJAX 函数返回一个 promise（实际上是一个 jQuery Deferred，但它们可以类似地使用）。

在等待 DOM 加载之前启动 AJAX 请求，然后处理结果。

let get_promise = $.get(...);
$(document).ready(() => {
  get_promise.then(callback)
});

【讨论】：