Wie kann ich mit JavaScript Daten aus einer lokalen JSON-Datei lesen?

Externe lokale JSON-Dateien in JavaScript lesen

Um auf Daten aus einer externen lokalen JSON-Datei in JavaScript zuzugreifen, befolgen Sie diese Schritte:

JSON-Datei erstellen:

• Speichern Sie die JSON Daten in einer lokalen Datei, z. B. test.json mit folgendem Inhalt:

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

JavaScript-Code:

Sobald die JSON-Datei erstellt wurde, Schreiben Sie ein JavaScript-Skript, um es zu lesen:

// 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}`);
  }
};

Beispiel Verwendung:

Um diesen Code zu verwenden, fügen Sie sowohl die test.json-Datei als auch das JavaScript-Skript in Ihr HTML-Dokument ein:

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

Dieser Code erstellt eine asynchrone HTTP-GET-Anfrage an die JSON-Datei, ruft die Antwort ab, analysiert sie als JSON und gibt die relevanten Daten auf der Konsole aus.

Das obige ist der detaillierte Inhalt vonWie kann ich mit JavaScript Daten aus einer lokalen JSON-Datei lesen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!