Javascript 如何解析此api中的数据并将其显示在我的html中？

我是javascript新手，在过去的几个小时里，我一直在尝试将json数据从api url解析到html文档中的正文中。我使用API的唯一经验是使用C包装器，所以这对我来说是新的

这是API url：

我不知道接下来该怎么办。我已经能够成功地提取我想要的数据，但我只能将其打印到控制台，我不知道如何将该数据提取到html中。以下是我的javascript代码：

var HttpClient = function() {
this.get = function(aUrl, aCallback) {
    var XMLHttpRequest = require("xmlhttprequest").XMLHttpRequest;
    var anHttpRequest = new XMLHttpRequest();
    anHttpRequest.onreadystatechange = function() {
        if (anHttpRequest.readyState == 4 && anHttpRequest.status == 200)
            aCallback(anHttpRequest.responseText);
    }

    anHttpRequest.open( "GET", aUrl, true );
    anHttpRequest.send( null );
    }
}
var client = new HttpClient();
client.get('https://catfact.ninja/fact', function(response) {
    var vsplit = response.split("\"")
    console.log(vsplit[3]);
    $('body').html(document.write(vsplit[3]));

});

---

感谢您的帮助，如果我看起来很笨，很抱歉。您遇到的第一个问题是，在html函数中调用document.write将不会产生您认为的结果。write是一个同步写入函数，它尝试在调用时将字符串注入DOM呈现程序。如果你删除了它，你会有更多的运气在HTML中看到一些东西，但是你也可以使用下面的方法

政府的回应如下

{"fact":"Cats' eyes shine in the dark because of the tapetum, a reflective layer in the eye, which acts like a mirror.","length":109}

当格式为JSON时，无需拆分响应。可以使用JSON.parse创建Javascript对象。比如说

// data will contain data.fact, and data.length 
var data = JSON.parse(response);

// Without using jQuery, you can set the html of the body directly
var body = document.getElementsByTagName("body")[0];
body.innerHTML = data.fact;

---

签出看起来像是要选择HTML中的元素并将其设置为数据。您可能需要首先使用JSON.stringifything将其转换为字符串，null，其中thing是您的数据，null不重要=2是JSON格式的间距。你也可以尝试提取你想要的对象的值。很抱歉，我迷路了！我不是想让你帮我写代码，但你认为你能带我看完吗？当然。把它写在codepen或类似的东西上，我会看看italso，尝试使用axios而不是xmlhttp请求。它将以更容易处理的格式提取数据。那么你就不必重新格式化了。我只是试了一下，但是当我加载html文件时，仍然没有显示任何内容。你能从控制台粘贴任何响应吗？另外，您什么时候调用client.get函数？您正在等待文档加载吗？您应该等待body onload事件或jQuery document ready事件。