39 lines
972 B
JavaScript
39 lines
972 B
JavaScript
function fakeFetchUser() {
|
|
return new Promise(function (resolve) {
|
|
setTimeout(function () {
|
|
resolve({
|
|
name: "林晨",
|
|
role: "前端学习者",
|
|
focus: "DOM + 事件 + 异步",
|
|
});
|
|
}, 900);
|
|
});
|
|
}
|
|
|
|
// 任务：
|
|
// 1. 获取按钮、状态文字、信息面板
|
|
// 2. 写一个 async 函数
|
|
// 3. 用 await 等待 fakeFetchUser()
|
|
// 4. 渲染用户信息
|
|
// 5. 用 try...catch 处理异常
|
|
const btn = document.getElementById("load-user-btn")
|
|
const status = document.getElementById("user-status")
|
|
const card = document.getElementById("user-card")
|
|
|
|
async function a() {
|
|
status.textContent = "加载中"
|
|
card.innerHTML = ""
|
|
|
|
try {
|
|
const a = await fakeFetchUser()
|
|
status.textContent = "加载成功"
|
|
card.innerHTML = `
|
|
<p>姓名：${a.name}</p>
|
|
<p>角色：${a.role}</p>
|
|
<p>任务：${a.focus}</p>
|
|
`
|
|
} catch (error) {
|
|
status.textContent = "加载失败"
|
|
}
|
|
}
|
|
btn.addEventListener("click", a) |