此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。

View in English Always switch to English

Response.json()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨2017年3月⁩.

Response mixin 的 json() 方法接收一个 Response 流,并将其读取完成。它返回一个 Promise,Promise 的解析 resolve 结果是将文本体解析为 JSON

语法

js
response.json().then((data) => {
  // do something with your data
});

参数

没有。

返回值

返回一个被解析为 JSON 格式的 promise 对象,这可以是任何可以由 JSON 表示的东西 - 一个 object,一个 array,一个 string,一个 number...

示例

在我们的 fetch json 示例 中 (运行 fetch json live), 我们使用 Request.Request 构造函数创建一个新的请求,然后使用它来获取一个 .json 文件。当获取成功时,我们使用 json() 读取并解析数据,然后像预期的那样从结果对象中读取值,并将其插入到列表项中以显示我们的产品数据。

js
const myList = document.querySelector("ul");
const myRequest = new Request("products.json");

fetch(myRequest)
  .then((response) => response.json())
  .then((data) => {
    for (const product of data.products) {
      let listItem = document.createElement("li");
      listItem.appendChild(document.createElement("strong")).textContent =
        product.Name;
      listItem.append(` can be found in ${product.Location}. Cost: `);
      listItem.appendChild(document.createElement("strong")).textContent =
        `£${product.Price}`;
      myList.appendChild(listItem);
    }
  });

规范

Specification
Fetch
# ref-for-dom-body-json①

浏览器兼容性

参见