从API获取数据并使用jQuery将其分离为变量

Question

我正在尝试请求数据,然后P使用相关属性填充9个不同的标签,我只是在努力解决这个问题.

// Gets BTC Price in 3 currencies
var btc = "https://min-api.cryptocompare.com/data/price?fsym=BTC&tsyms=USD,EUR,GBP";

// Gets ETH Price in 3 currencies
var eth = "https://min-api.cryptocompare.com/data/price?fsym=ETH&tsyms=USD,EUR,GBP";

// Gets LTC Price in 3 currencies
var ltc = "https://min-api.cryptocompare.com/data/price?fsym=LTC&tsyms=USD,EUR,GBP";

$.getJSON( btc, function( data ) {
  var items = [];
  $.each( data, function( key, val ) {
    items.push( key + val );
  });

  // see fetched data to then be stored for later use...
  alert( "JSON Data: " + items[1,1] );

});

我之前没有使用API​​,所以我不确定是否需要有3个getJSON功能,或者我能以某种方式将它们组合起来吗？

到目前为止,这是一个显示我进步的小提琴

https://jsfiddle.net/mvs26pv8/

Answer 1

您可以插入值 html()

// Gets BTC Price in 3 currencies
getData('btc', 'https://min-api.cryptocompare.com/data/price?fsym=BTC&tsyms=USD,EUR,GBP');

// Gets ETH Price in 3 currencies
getData('eth', 'https://min-api.cryptocompare.com/data/price?fsym=ETH&tsyms=USD,EUR,GBP');

// Gets LTC Price in 3 currencies
getData('ltc', 'https://min-api.cryptocompare.com/data/price?fsym=LTC&tsyms=USD,EUR,GBP');

function getData(prefix, url) {
  $.getJSON(url, function(data) {
    $.each(data, function(key, val) {
      $('.' + prefix + '-' + key.toLowerCase()).html(val);
    });
  });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<p>BTC in EUR = <span class="btc-eur"></span></p>
<p>BTC in GBP = <span class="btc-gbp"></span></p>
<p>BTC in USD = <span class="btc-usd"></span></p>

<br/><br/>

<p>ETH in EUR = <span class="eth-eur"></span></p>
<p>ETH in GBP = <span class="eth-gbp"></span></p>
<p>ETH in USD = <span class="eth-usd"></span></p>

<br/><br/>

<p>LTC in EUR = <span class="ltc-eur"></span></p>
<p>LTC in GBP = <span class="ltc-gbp"></span></p>
<p>LTC in USD = <span class="ltc-usd"></span></p>