首页 > 解决方案 > 如何从api获取json数组

问题描述

我无法从我的 API 中获取 JavaScript 中的标题。我想在 HTML 中显示标题。

api:(https://k0wa1un85b.execute-api.us-east-1.amazonaws.com/production/books)

JSON 响应如下所示:

{"statusCode":200,"body":[{"id":"4f160b1f8693cdbeb96ac8be135ff0f9","title":"Harry Potter"}]}

javascript:

  <body>    
    <p>
        title: <span id="tit"></span><br/>
    </p>    
    <script>
        const api_url = 'https://k0wa1un85b.execute-api.us-east-1.amazonaws.com/production/books';
        async function getISS() {
            const response = await fetch(api_url);
            const data = await response.json();

             console.log(data);

            const {title} = (data);

            document.getElementById('tit').textContent = title;
        }
        getISS();
    </script>
  </body 

标签: javascriptjson

解决方案


像这样使用它。

const api_url = 'https://k0wa1un85b.execute-api.us-east-1.amazonaws.com/production/books';
        async function getISS() {
            const response = await fetch(api_url);
            const data = await response.json();

             console.log(data);

            const title = data.body[0].title;
            console.log(title)
            document.getElementById('tit').textContent = title;
        }
 getISS();
<p>
   title: <span id="tit"></span><br/>
</p>    


推荐阅读