XMLHttpRequest - 属性の解析 - JS

Question

まず、これは完全な初心者の質問です。私は何をしているのか分かりません。

私はJustGivingからトップ10の資金調達者を返すAPIを持っています。表示するXML情報を取得することはできますが、すべてをまとめてダンプするだけです。私は、Webページ上で操作することができるものには、この情報の出力を得るためにさまざまな方法で時間

var xhr = new XMLHttpRequest(); 
xhr.open("GET", "https://api.justgiving.com/{appid}/v1/event/{eventID}/leaderboard?currency=gbp/", true); 
xhr.responseJSON; 
xhr.send(); 

xhr.onreadystatechange = processRequest; 

function processRequest(e) { 
    if (xhr.readyState == 4 && xhr.status == 200) { 
     document.write(xhr.responseText); 
    } 
} 

私がされている外観：これは、JSは、私がこれまで持っているものです。 divにラップすることができるもの。私は変更する必要が

かなり確信してその本...

document.write(xhr.responseText); 

助けたり、正しい方向に私を指すください。または、私が間違った方向に完全に行った場合、私に知らせてください。おそらくそこにはすでに解決策があるかもしれませんが、私の知識が非常に限られているため、おそらくすべての検索が間違っていると言います。

APIのドキュメントは、事前にhttps://api.justgiving.com/docs/resources/v1/Leaderboard/GetEventLeaderboard

多くのおかげです。

Answer 1

あなたはJSにいるので、可能な限りXMLで作業するのは避けてください。

リクエストに適切なヘッダーを含める場合、JustGiving APIもJSON応答を提供できる必要があります。以下のような

何か：

var xhr = new XMLHttpRequest(); 
xhr.open("GET", "https://api.justgiving.com/{appid}/v1/event/{eventID}/leaderboard?currency=gbp/", true); 

// Add accept header to indicate you want JSON 
xhr.setRequestHeader("Accept", "application/json"); 
xhr.send(); 

xhr.onreadystatechange = processRequest; 

function processRequest(e) { 
    if (xhr.readyState == 4 && xhr.status == 200) { 

     // Parse the JSON in the response 
     document.write(JSON.parse(xhr.responseText)); 
    } 
}