Javascript 如何将结构化API数据提取到HTML（JSON.parse？）

我一直在一个网站上工作，该网站必须显示从API检索到的数据，但我对Javascript不太熟悉。即使在学习了一些教程并查找了其他有关堆栈溢出的主题之后，我似乎还是不理解其中的逻辑。所以我希望这里的任何人都能帮助我

现在，我正在从指定的API提取数据，例如：

$.get( "https://min-api.cryptocompare.com/data/price?fsym=BTC&tsyms=EUR",
    function( data ) {
        $( '#btcwaarde' ).text( data["EUR"] );
    }
);

这实际上是可行的，但只适用于每个API请求检索1条数据。我想做的是从更大的JSON数据块中检索数据，例如：从

要做到这一点，我需要了解我应该使用哪个函数和数组逻辑。我还研究了

JSON.parse

，但我并不真正理解它是如何工作的

谁能给我解释一下，或者给我一个例子，我可以用它来进一步构建代码

编辑：我想要实现的是在我的网站上以HTML元素显示数据。因此，HTML将类似于：

<div class="element">
     <span id="BTCprice"></span>
     <span id="BTCmktcap"></span>
</div>
<div class="element">
    <span id="ETHprice"></span>
    <span id="ETHmktcap"></span>
</div>

然后，唯一的

必须显示从与

相关的API中提取的数据

---

例如，

#BTCprice

必须显示

[DISPLAY][BTC][EUR][PRICE]

中的信息，而

#ETHmktcap

必须在OP编辑后显示

[DISPLAY][ETH][EUR][MKTCAP]

中的信息。更复杂的解决方案：

$(function() {

 $.get( "https://min-api.cryptocompare.com/data/pricemultifull?fsyms=BTC,ETH,DASH,LTC,XRP&tsyms=EUR", function( data ) {
  $.each(data['DISPLAY'], function( index, value ) {

    var spanPrice = $('<span/>')
        .attr('id', index+"price")
        .html(value['EUR']['PRICE']);

    var spanMktcap = $('<span/>')
        .attr('id', index+"mktcap")
        .html(value['EUR']['MKTCAP']);

    var $newDiv = $("<div/>")   // creates a div element
        .attr("id", index)  // adds the id
        .addClass("element")   // add a class
        .append(spanPrice)
        .append(spanMktcap)

         $("code").append($newDiv);
  });
});

});

$（函数（）{
$.get（”https://min-api.cryptocompare.com/data/pricemultifull?fsyms=BTC，ETH，DASH，LTC，XRP&tsyms=EUR”，功能（数据）{
$.each（数据['DISPLAY']，函数（索引，值）{
var spanPrice=$（''）
.attr（'id'，索引+“价格”）
.html（价值['EUR']['PRICE']）；
变量spanMktcap=$（''）
.attr（'id'，索引+“mktcap”）
.html（值['EUR']['MKTCAP']）；
var$newDiv=$（“”）//创建一个div元素
.attr（“id”，index）//添加id
.addClass（“元素”）//添加一个类
.附加（价格）
.append（spanMktcap）
$（“代码”）。追加（$newDiv）；
});
});
});

对象访问 以下内容是在问题更新之前发布的；请参阅下面的答案更新：

如果不确切地知道您希望如何访问数据，就很难提供一个确切地说明您希望实现什么的答案

但基本上，它有一个

key:value

结构，可以访问它，使用哪种方式取决于具体情况

var-req=new-XMLHttpRequest（）；
req.addEventListener（“readystatechange”，函数（）{
如果（req.readyState==4）{
如果（请求状态===200）{
var rt=req.responseText，//这是一个字符串
json=json.parse（rt）；//将字符串解析为对象
//访问对象值
log（json[“原始”][“BTC”][“欧元”][“类型”]）；
//或
log（json.RAW.BTC.EUR.TYPE）；
}否则如果（请求状态）{
控制台警告（请求状态）；
}否则{
错误（“危险威尔·罗宾逊！”）；
}
}
}，假）；
请求打开（“获取”https://min-api.cryptocompare.com/data/pricemultifull?fsyms=BTC、ETH、DASH、LTC、XRP和tsyms=欧元”，真实）；
请求setRequestHeader（“接受”、“应用程序/json”）；
请求发送（）你还没有说出你想要实现的目标。这使得很难提供帮助。听起来你真的应该读一本介绍性的JavaScript教程。数组和对象的基本处理是任何入门指南都应该涵盖的基本内容。“我还研究了JSON.parse”-jQuery在幕后调用它。这就是为什么你的第一个例子有效。谢谢你的帮助，我刚刚添加了关于我想要达到的目标的信息！这是可行的，但现在它会显示段落中每个数组项的信息。例如，如果我想指定它只加载['BTC']，该怎么办？只需直接访问数组元素：
$https://min-api.cryptocompare.com/data/pricemultifull?fsyms=BTC，ETH，DASH，LTC，XRP&tsyms=EUR”，函数（数据）{$（'btcwaarde'）。文本（数据['DISPLAY']['BTC']['EUR']['PRICE']]；}）