Javascript 如何在html中显示Json API数据？

我非常擅长html和css，但绝对没有使用javascript的经验

我想在html页面中显示从该API接收的日期

这就是我一直在尝试的方法，直到现在都没有成功

var getJSON=functionurl{ 返回新的允诺函数解析、拒绝{ var xhr=新的XMLHttpRequest； xhr.open'get'，url，true； xhr.responseType='json'； xhr.onload=函数{ var status=xhr.status； 如果状态==200{ 解析响应； }否则{ 拒绝状态； } }; xhr.send； }; }; getJSON'https://api.travelpayouts.com/data/routes.json?token=mytoken“.然后是函数数据{ 警报“您的Json结果为：”+data.result； result.innerText=data.result； }，函数状态{ 警惕“出了问题”； };

---

这段代码正在使用

我建议你多了解一些

编辑：我已经更新了我的答案以适合你的情况。工作小提琴

Javascript

<script>

$(document).ready(function(){

   $.ajax({
            url: "http://api.travelpayouts.com/data/routes.json?token=PutHereYourToken",
            type: 'GET',
            dataType: 'json',
            success: function(res) {
               $('#result').html(res)
            }
        });

})

</script>

---

不要忘了在html的head部分包含jQuery和javascript代码。

下面是一个不使用jQuery的工作示例

// Callback to run when data is ready
function reqListener() {
  // Parse the JSON text to an object so we can get just one property
  var data = JSON.parse(this.responseText);
  // Append that value to the DOM.
  document.querySelector("#demo").innerHTML = data.body;
}

// Create a new ajax requst
var oReq = new XMLHttpRequest();
// Fire callback on load event
oReq.addEventListener("load", reqListener);
// Create the connection to our API
oReq.open("GET", "https://jsonplaceholder.typicode.com/posts/1");
// Fire the request
oReq.send();

---

了解更多关于ajax的信息，并在您实际付出一些努力后，看看这是否有效。我们的工作是，一旦你证明你已经亲自尝试过，我们就会提供帮助。“你还没有在这里这么做。@Carcigenicate，让我用3分钟来编辑我的问题，也许你会发现我试过了。这可不像是我两个小时以来一个人没有试过就来问的。@sloane你会惊讶的，人们总是这么做。如果你试过，展示你的作品。我们不知道你没有展示什么。在将来，请从一开始就展示您的努力，这样您就不会在没有亲自尝试的情况下要求回答。注意，JQuery不需要使用AJAX，但它确实简化了它的使用。很高兴我能提供帮助。那么你能接受这个答案吗？

// Callback to run when data is ready
function reqListener() {
  // Parse the JSON text to an object so we can get just one property
  var data = JSON.parse(this.responseText);
  // Append that value to the DOM.
  document.querySelector("#demo").innerHTML = data.body;
}

// Create a new ajax requst
var oReq = new XMLHttpRequest();
// Fire callback on load event
oReq.addEventListener("load", reqListener);
// Create the connection to our API
oReq.open("GET", "https://jsonplaceholder.typicode.com/posts/1");
// Fire the request
oReq.send();