问题遇到的现象和发生背景
做一个读取数据库的html 和js，但是html里关于数据库是空白
问题相关代码，请勿粘贴截图
<!DOCTYPE html>
<html lang="en">
<head>
<title>Final Assigment</title>
<script type="text/javascript"></script>
<meta charset="UTF-8">
<title>Final Assigment</title>
<script defer src="final.js"></script>
<link rel="stylesheet" href="final.css">
</head>
<body onload="getData()">
<h1>Final Assigment Of Web</h1>
<div id="Thirty_measurements"></div>
<h2>30 Measurement from API</h2>
</body>
</html>
```javascript
function dataToHtmlRepresentation(dataObjects){
let html='<table><tr><th>Row Number</th><th>Measurement time</th><th>Measurement Type</th><th>Measured Value</th></tr>';
const l = dataObjects.length;
for (let i = 0; i < l; i++) {
const dataObject = dataObjects[i];
html +=`
<tr>
<td>${dataObject[i].id}</td>
<td>${dataObject[i].device_id}</td>
<td>${dataObject[i].date_time}</td>
<td>${dataObject[i].data}</td>
</tr>
`
}
html += '</table>';
return html;
}
const DATA_SOURCE = 'http://webapi19sa-1.course.tamk.cloud/v1/weather';
// Making a get request using the Fetch API
function getData() {
fetch(DATA_SOURCE).then(response => {return response.json()})
.then(data => {
const e = document.getElementById("data-container");
e.innerHTML = dataToHtmlRepresentation(data);
})
.catch(error => console.error('AAARRRGH! ' + error));
}
运行结果及报错内容
结果是完全不显示关于数据库的内容
我的解答思路和尝试过的方法
我的思路是html里body onload可能有问题，但是没能解决
