HTML代码示例：根据API接口显示图片、数据和时间
以下是使用HTML代码根据给定接口返回数据进行图片显示、数据显示和时间显示的示例：
<!DOCTYPE html>
<html>
<head>
<title>API Data Display</title>
</head>
<body>
<h1>API Data Display</h1>
<div id='imageContainer'></div>
<div id='dataContainer'></div>
<div id='timeContainer'></div>
<script>
fetch('https://api.vvhan.com/api/60s')
.then(response => response.json())
.then(data => {
// Display image
var imageContainer = document.getElementById('imageContainer');
var imageElement = document.createElement('img');
imageElement.src = data.imgUrl;
imageContainer.appendChild(imageElement);
// Display data
var dataContainer = document.getElementById('dataContainer');
var dataElement = document.createElement('p');
dataElement.textContent = 'Data: ' + data.data;
dataContainer.appendChild(dataElement);
// Display time
var timeContainer = document.getElementById('timeContainer');
var timeElement = document.createElement('p');
timeElement.textContent = 'Time: ' + data.time;
timeContainer.appendChild(timeElement);
})
.catch(error => console.log(error));
</script>
</body>
</html>
请将以上代码保存为一个HTML文件，并在浏览器中打开该文件，即可看到根据给定接口返回的数据进行图片显示、数据显示和时间显示的效果。
原文地址: https://www.cveoy.top/t/topic/pbkk 著作权归作者所有。请勿转载和采集!