我正在使用 javascript ajax 从 JSON API 服务器获取数据，并希望在 HTML 表中显示这些数据。但我在 HTML 数据中收到未定义的错误。那是Name idundefined undefined有我的代码<html><body> <table class = "src"> <tr><th>Name</th><th>id</th></tr> <tr><td><div id="Name"></div></td> <td><div id="Id"></div></td></tr> </table> </body></html><script type="text/javascript"> var xmlhttp = new XMLHttpRequest();var url = "https://jsonplaceholder.typicode.com/users"; xmlhttp.onreadystatechange = function(e) { if (this.readyState == 4 && this.status == 200) { // Javascript function JSON.parse to parse JSON data var jsonObj = JSON.parse(this.responseText); // jsonObj variable now contains the data structure and can // be accessed as jsonObj.name and jsonObj.country. document.getElementById("Name").innerHTML = jsonObj.name; document.getElementById("Id").innerHTML = jsonObj.id; } } xmlhttp.open("GET", url, true); xmlhttp.send();</script>我应该怎么做才能解决这个问题？提前致谢。
1 回答
DIEA
TA贡献1820条经验 获得超2个赞
问题是您正在尝试访问一个对象，但 API 的输出实际上是一个数组。jsonObj[0]您可以通过执行以下操作来获取第一个对象：
<html>
<body>
<table class = "src">
<tr><th>Name</th><th>id</th></tr>
<tr><td><div id = "Name"></div></td>
<td><div id = "Id"></div></td></tr>
</table>
</body>
</html>
<script type="text/javascript">
var xmlhttp = new XMLHttpRequest();
var url = "https://jsonplaceholder.typicode.com/users";
xmlhttp.onreadystatechange = function(e) {
if (this.readyState == 4 && this.status == 200) {
// Javascript function JSON.parse to parse JSON data
var jsonObj = JSON.parse(this.responseText);
// jsonObj variable now contains the data structure and can
// be accessed as jsonObj.name and jsonObj.country.
document.getElementById("Name").textContent = jsonObj[0].name;
document.getElementById("Id").textContent = jsonObj[0].id;
}
}
xmlhttp.open("GET", url, true);
xmlhttp.send();
</script>
请参阅代码运行的代码和框。
最好使用textContent而不是innerHTML避免呈现不需要的 HTML（永远不要相信用户输入！）。
- 1 回答
- 0 关注
- 81 浏览
添加回答
举报
0/150
提交
取消