如何从ajax文件加载JSON对象?

我正在使用JSON传输数据。

我的HTML页面需要什么来读取一个只包含一个JSON对象的Ajax文件到我的脚本中?

我是否也需要jQuery,还是可以使用Ajax加载该JSON文件?

它在不同的浏览器上有所不同吗?


你不需要任何库,一切都可以在香草JavaScript中获取一个JSON文件并解析它:

function fetchJSONFile(path, callback) {
    var httpRequest = new XMLHttpRequest();
    httpRequest.onreadystatechange = function() {
        if (httpRequest.readyState === 4) {
            if (httpRequest.status === 200) {
                var data = JSON.parse(httpRequest.responseText);
                if (callback) callback(data);
            }
        }
    };
    httpRequest.open('GET', path);
    httpRequest.send(); 
}

// this requests the file and executes a callback with the parsed result once
//   it is available
fetchJSONFile('pathToFile.json', function(data){
    // do something with your data
    console.log(data);
});

最有效的方法是使用普通的JavaScript:

var a = new XMLHttpRequest();
a.open("GET","your_json_file",true);
a.onreadystatechange = function() {
  if( this.readyState == 4) {
    if( this.status == 200) {
      var json = window.JSON ? JSON.parse(this.reponseText) : eval("("+this.responseText+")");
      // do something with json
    }
    else alert("HTTP error "+this.status+" "+this.statusText);
  }
}
a.send();

过去,Ajax在不同的浏览器中有所不同(仍然是,如果您需要支持许多用户不幸仍在使用的旧浏览器)。 对于较老的浏览器,您需要一个类似JQuery的库(或您自己的等效代码)来处理浏览器差异。 无论如何,对于初学者来说,我可能会推荐jQuery使用优秀的文档,简单的API以及快速入门,尽管MDN对于JavaScript本身也很有帮助(即使您主要负责JavaScript的DOM API,依靠jQuery)。

链接地址: http://www.djcxy.com/p/74355.html

上一篇: How do I load a JSON object from a file with ajax?

下一篇: Elmah getting stuck in default route?