使用（JavaScript）从文件中获取JSON数据

Question

I need to know how can I get json data using JavaScript without using Jquery. 我需要知道如何在不使用Jquery的情况下使用JavaScript获取json数据。 I just want to know how to get data only using JavaScript. 我只想知道如何使用JavaScript获取数据。

My Json file. 我的Json文件。

{"JsonProjectIDResult":[{"_capacity":15,"_description":"Meeting Room","_dev_default_view":3,"_deviceID":1,"_deviceName":"MobiTech","_deviceTypeID":1,"_projectID":1,"_roomID":2,"_roomName":"Room2","_room_admin_mail":null}]}

My home.html file 我的home.html文件

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>JavaScript Get Json</title>

</head>
<body>

<h1>My Home Page</h1>

<div id="results">
    <!-- Display Jason Data -->
</div>

<script>

    var resultDiv = document.getElementById("results");

    var newsURL = "http://localhost:81/testjs/data.json";

    var e;

    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        e = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        e = new ActiveXObject("Microsoft.XMLHTTP");
    }

    e.onreadystatechange = function() {

        var html = " ";

        if (e.readyState == 4 && e.status == 200) {
            response = JSON.parse(e.responseText);

            if(typeof(e.responseText)==="string") {
                d = e.responseText;
            } else {
                if (typeof(e.responseXML)==="object") {
                    d = e.responseXML;
                };
            }

            var myData = response['JsonProjectIDResult'];

            //Print results 
            html  = myData[0]._capacity+"<br />";
            html += myData[0]._description+"<br />";
            html += myData[0]._dev_default_view+"<br />";
            html += myData[0]._deviceID+"<br />";
            html += myData[0]._deviceName+"<br />";
            html += myData[0]._deviceTypeID+"<br />"; 
            html += myData[0]._projectID+"<br />"; 
            html += myData[0]._roomID+"<br />"; 
            html += myData[0]._roomName+"<br />"; 
            html += myData[0]._room_admin_mail+"<br />";

            resultDiv.innerHTML = html;
        }
    };

    e.open("GET", newsURL, true);
    e.send();

</script>

</body>
</html>

After my friends gave me some helpful answer I wondered my code like this. 在我的朋友们给了我一些有用的答案后，我想知道我的代码是这样的。 It's working. 它正在发挥作用。 Now I need to run this as a loop. 现在我需要将其作为循环运行。 When every records display using a loop. 当每个记录使用循环显示时。 Can I do it in JavaScript. 我可以用JavaScript完成吗

Answer 1

<script>
var resultDiv = document.getElementById("results");

var newsURL = "http://localhost:81/testjs/data.json";


var xmlhttp;

if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp = new XMLHttpRequest();
} else {
    // code for IE6, IE5
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        response = JSON.parse(xmlhttp.responseText);
        //here you can manipulate the response as you wish, for example you can:
        var myData = response['JsonProjectIDResult'];
        // myData now is an array of the json object
        var html = '<ul>';
        for(var prop in myData ) {
            if(myData.hasOwnProperty(prop))
                 html += '<li>' + prop  + ' = ' + myData[prop] + '</li>';
        }
        html += '</ul>';
        //and so on
        resultDiv.innerHTML = html;
    }
}

xmlhttp.open("GET", newsURL, true);
xmlhttp.send();
</script>

使用（JavaScript）从文件中获取JSON数据

问题描述

1 个解决方案

解决方案1
2 已采纳 2013-08-25 04:17:40

使用（JavaScript）从文件中获取JSON数据

问题描述

1 个解决方案

解决方案1 2 已采纳 2013-08-25 04:17:40

解决方案1
2 已采纳 2013-08-25 04:17:40