AJAX Bitcoin (练习了bitcoin api的使用和XMLHttpRequest的调用)

ajax-bitcoin-starter.markdown

AJAX Bitcoin STARTER

A Pen by liuxiaomingskm on CodePen.

License.

index.html

<h1>Bitcoin Current Price is: <span id="price"></span></h1>

<button id="btn">Refresh Data</button>

script.js

var btn = document.querySelector("#btn");
var span = document.querySelector("#price");
//listen for click
btn.addEventListener("click", function(){
  //make the request
  var XHR = new XMLHttpRequest();
  XHR.onreadystatechange = function(){
    if (XHR.readyState == 4 && XHR.status == 200){
      var currency = JSON.parse(XHR.responseText).bpi.CNY.code;
      var rate = JSON.parse(XHR.responseText).bpi.CNY.rate;
      console.log(currency, rate);
      span.innerHTML = rate + " " + currency ;
    }
  }
  
XHR.open("GET","https://api.coindesk.com/v1/bpi/currentprice/CNY.json");
XHR.send();  
  
  
});

style.css

span {
  color: green;
}

button {
  border: 2px blue solid;
  border-radius: 5px;
  color: #0033ff;
}