JavaScriptを使用してサーバー内の静的JSONファイルを読み込んで解析する方法

Question

javascriptとjsonを使用し始めました。

javascript関数でイベントを処理するときにjsonファイルからデータ（getInformation関数）を読み取る必要があります。だから私はそれが同期している必要があります。私はコードに何か不足しているかどうか、またはリクエストを作成してコールバックを処理する必要があるか、またはjsonを使用するために追加のjavascriptをインポートする必要があるかどうかはわかりません。私はそれを動作させる方法を知らないので。最終的に配列が空であるため、動作しません。任意のヘルプが評価されます。

JSONファイル：

{"Users": [ 
    {"Name": "Jane", 
     "Points": 67, 
     "age": 23}, 
    { 
     "Name": "Sam", 
     "Points": 65, 
     "age": 21} 
]} 

オプション1 - イベントを処理している別の関数によって呼び出される関数：

var getInformation = function() 
{ 
    var path = "./data/users.json"; 
    var informationArray= []; 
    console.log("Loading ...."); 
    $.getJSON(path, function(data) 
    { 
     $.each(data, function(key, val) 
     { 
      informationArray.push(key + '-' + val); 
     }); 
    }); 
    return informationArray; 
} 

オプション2 - イベントを処理している別の関数によって呼び出された機能：

var getInformation = function() { 
var path = "./data/users.json"; 
var informationArray= []; 
$.ajax({ 
     url: path, 
     async: false, 
     dataType: 'json', 
     success: function(response) { 
     $.each(response.items, 
     function(item) { 
     informationArray.push(item); 
     }); 
     informationArray.push("success"); 
     } 
     }); 
    return informationArray; } 

私は次のスレッドを見て、そこに何を試していますかしかし私のために働かないでください。私は自分のコードのどこに問題があるのか​​、特別な設定が必要なのかを知りたい。

スレッド：Is there a version of $getJSON that doesn't use a call back?

Answer 1

（コールバックを必要としない）JSONファイルをロードするには、使用したい：

var url = 'http://yoursite.com/data/users.json'; 
var j = []; 
$.ajax({ 
    type: 'GET', 
    url: url, 
    dataType: 'json', 
    success: function(data) { j = data;}, 
    async: false 
}); 

alert(j.Users[0].Name); 

Answer 2

をJavaScriptはそれがAJAXリクエストを行う必要があるブラウザで実行されている場合サーバーはJSONファイルにアクセスします。手作業でAJAXリクエストを書くことは可能ですが、それは複雑ですべてのブラウザで作業するのが難しいです。代わりに、ほとんどの人はjQueryのようなライブラリを使います。

$.ajax({ 
    url: "data/users.json", 
    dataType: "json", 
    success: function(response) { 
    $.each(response.Users, function(item) { 
     informationArray.push(item); 
    }); 
    informationArray.push("success"); 
    } 
}); 

がhttp://api.jquery.com/jQuery.ajax/

を参照してください。そして、下のHTMLページ内の任意のスクリプトタグにあなたのような何かを行うことができるはず

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script> 

：あなたのような何かを自分のWebページでのjQueryを含める必要があります