jsonを1つのウェブサイトからhtmlウェブサイトに表示する

Question

特定のウェブサイトから出力されたjsonをHTMLウェブサイトに表示しようとしています。例えば、これは、サイトexample.com上のJSONだろう

[ { "nickname":"name", "votes":"3" }, { "nickname":"name", "votes":"2" }, { "nickname":"name", "votes":"2" }] 

どのように私がexample.comからデータを取得し、私のhtmlのウェブサイトmydomain.com上に表示することができますか？どんな助けも素晴らしいだろう！

Answer 1

jsonオブジェクトとして解析すると、それを表示するためのループが実行されます。私が作った以下の例を実行します。

var text = '{"employees":[' + 
 
'{"firstName":"John","lastName":"Doe" },' + 
 
'{"firstName":"Anna","lastName":"Smith" },' + 
 
'{"firstName":"Peter","lastName":"Jones" }]}'; 
 

 
obj = JSON.parse(text); 
 

 
for (i = 0; i < obj.employees.length; i++) { 
 
document.getElementById("demo").innerHTML += 
 
obj.employees[i].firstName + " " + obj.employees[i].lastName+ "<br/>";  
 
}

<h2>Create Object from JSON String</h2> 
 

 
<p id="demo"></p>

Answer 2

あなたのJSONオブジェクトを含む配列です。各オブジェクトにはnicknameとvotesのメンバーがあります。

function votesByNicknameTemplate(input, target) { 
    var output = ""; 
    for (var index in input) { 
     output += input[index].nickname + " has " + input[index].votes + "<br>"; 
    } 
    target.innerHTML += output 
} 

あなたがvotesByNicknameTemplate([ { "nickname":"name", "votes":"3" }, { "nickname":"name", "votes":"2" }, { "nickname":"name", "votes":"2" }], document.getElementsByTagName("body")[0]);を使用して、これを呼び出した場合、あなたはbodyにoutputを書く：あなたはこのようなテンプレートを持っているとしましょう。同じ結果が、より一般的な解決策で）runTemplate([ { "nickname":"name", "votes":"3" }, { "nickname":"name", "votes":"2" }, { "nickname":"name", "votes":"2" }], document.getElementsByTagName("body")[0], "votesByNicknameTemplate"を呼び出し、その後

function runTemplate(input, target, templateName) { 
    window[templateName](input, target); 
} 

と：あなたはこのように、複数のテンプレートをサポートするために、これはさらにabstractizeすることができます。