41 lines
1.2 KiB
HTML
41 lines
1.2 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="author" content="flykhan" />
|
||
<meta name="keywords" content="c c++ 物联网" />
|
||
<title>AJAX的异步请求</title>
|
||
</head>
|
||
|
||
<body>
|
||
<div id="ret"></div>
|
||
<script>
|
||
window.onload = function () {
|
||
// 当页面加载完成后，则执行的程序
|
||
// 发起异步请求(HTTP)：
|
||
// 1) 请求方法
|
||
// 2) 请求头和请求体的数据怎么放
|
||
// 3) 相应的数据的怎么接
|
||
let url = "/cgi-bin/data1.cgi";
|
||
// 发起get请求，为了查询数据（从后端获取数据）
|
||
fetch(url)
|
||
.then((resp) => {
|
||
if (resp.status == 200) {
|
||
if (
|
||
resp.headers.get("Content-Type").startsWith("application/json")
|
||
) {
|
||
return resp.json(); // json 对象
|
||
} else {
|
||
return resp.text(); // 文本数据
|
||
}
|
||
}
|
||
})
|
||
.then((data) => {
|
||
console.log(data);
|
||
ret.innerText = "id=" + data.id + ", name=" + data.name;
|
||
});
|
||
};
|
||
</script>
|
||
</body>
|
||
</html>
|