如何使用JavaScript从本地JSON文件读取数据？

在 JavaScript 中读取外部本地 JSON 文件

要在 JavaScript 中从外部本地 JSON 文件访问数据，请按照以下步骤操作：

创建 JSON文件：

• 将 JSON 数据保存在本地文件中，例如 test.json，其中包含以下内容：

{
  "resource": "A",
  "literals": ["B", "C", "D"]
}

JavaScript 代码:

创建 JSON 文件后，编写 JavaScript 脚本来读取它：

// Step 1: Get JSON file path
const filePath = "/Users/Documents/workspace/test.json";

// Step 2: Create XMLHttpRequest object
const xhr = new XMLHttpRequest();

// Step 3: Open and send request
xhr.open("GET", filePath);
xhr.send();

// Step 4: Handle response
xhr.onload = function() {
  if (xhr.status === 200) {
    const response = JSON.parse(xhr.responseText);

    // Step 5: Access JSON data
    console.log(response.resource); // Output: "A"
    console.log(response.literals); // Output: ["B", "C", "D"]
  } else {
    console.error(`Error: ${xhr.status} - ${xhr.statusText}`);
  }
};

用法示例：

要使用此代码，请在 HTML 文档中包含 test.json 文件和 JavaScript 脚本：

<script src="/Users/Documents/workspace/test.json"></script>
<script src="script.js"></script>

此代码建立对 JSON 文件的异步 HTTP GET 请求，检索响应，将其解析为 JSON，然后打印将相关数据发送到控制台。

以上是如何使用JavaScript从本地JSON文件读取数据？的详细内容。更多信息请关注PHP中文网其他相关文章！