Question

我正在设置一个非常简单的计算器。

<!DOCTYPE html>
<p>Crypto Currency Diversifier</p>
<div class="container">
<h1>Crypto Currency Diversifier</h1>

<form action="/action_page.php">
   Dollars:<br>
  <input type="text" name="dollars" value="500"><br><br>
  # of Currencies:<br>
  <input type="text" name="quantity" value="20"><br><br>
  <input type="submit" value="Submit">
</form>

下一步是我需要提取前20个（数量）加密货币，然后将它们之间的500（美元）除以市值。

以下是API网站：https://coinmarketcap.com/api/

点击https://api.coinmarketcap.com/v1/ticker/?limit=10向我显示前10种货币。

如何在页面上添加每种货币的所有市值。然后从它们创建比率？

数学部分非常简单，我不知道如何实际从API链接中提取数据并以可行的格式获取数据。

Answer 1

查找Jquery和Ajax：

您可以这样实现：

function getCurrencies()

{
  $.ajax(
  {url:"https://api.coinmarketcap.com/v1/ticker/?limit=20",
     success:function(data) {
                //console.log(data);
                var totalcap=0.0;
                var u=$("<ul>");
                for(var i=0;i<data.length;i++) {
                    var currency=data[i];
                    var cap=parseFloat(currency["market_cap_usd"]);
                    var li=$("<li />").html(currency["name"] + " " + cap.toFixed(2).replace(/./g, function(c, i, a) {
    return i && c !== "." && ((a.length - i) % 3 === 0) ? ',' + c : c;
}));
     
                    u.append(li);
                    totalcap+=cap;
                }
                $('#currlist').html('').append(u);
                $('#cap').html(totalcap.toFixed(2).replace(/./g, function(c, i, a) {
    return i && c !== "." && ((a.length - i) % 3 === 0) ? ',' + c : c;
}));
                $('#data').val(JSON.stringify(data));
            },
            error:function() {
                alert("Error");
            },
            dataType:"json",
            type:"get"}
  
  );

}

textarea {width:600px;height:250px;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<p>Crypto Currency Diversifier</p>
<div class="container">
<h1>Crypto Currency Diversifier</h1>

<form action="/action_page.php">
   Dollars:<br>
  <input type="text" name="dollars" value="500"><br><br>
  # of Currencies:<br>
  <input type="text" name="quantity" value="20"><br><br>
  <input type="submit" value="Submit" onclick="getCurrencies(); return false"
>
  Total Market Cap:<div id="cap"></div><br />
  Currencies: <div id="currlist"></div><br />
  <textarea id="data"></textarea>
</form>

HTML的基本API：创建对象

1 个答案: