html 页面中 promise 未渲染内容，是因为 reject 被触发但未处理，导致 .then() 不执行，需添加 .catch() 捕获错误并正确显示。
在你的代码中，Promise 的逻辑是：当 toldThePeople === "BBQ Cauliflower" 时，与订单 "BBQ Corn" 不匹配，因此 reject("I WANT THE MANAGER!!!") 被调用。而 .then() 仅响应 resolve，对 reject 完全无感知——这正是页面空白的根本原因。
✅ 正确做法是：为 Promise 链添加 .catch()（或使用 .then(success, failure) 的双参数形式），确保无论成功或失败都能更新 DOM：
<script>
let tag = document.getElementById("demo");
function display(value) {
tag.innerHTML = value;
}
let toldThePeople = "BBQ Cauliflower";
let restaurantOrder = new Promise(function (resolve, reject) {
let order = "BBQ Corn";
if (toldThePeople === order) {
resolve("Mmm, You guys did an awesome job!");
} else {
reject("I WANT THE MANAGER!!!");
}
});
// ✅ 必须同时处理 resolve 和 reject
restaurantOrder
.then((value) => display(value))
.catch((error) => display(error)); // ← 关键：捕获并显示拒绝信息
</script>⚠️ 注意事项：
- Promise 一旦 reject，若未被 .catch() 或 try...catch（配合 await）捕获，控制台会抛出未处理的 rejection 警告（现代浏览器中可见）；
- 若希望统一处理逻辑，也可使用 .finally() 执行清理操作（如隐藏加载状态），但它不接收参数，也不影响链式结果；
- 开发时建议始终配对 .then() 与 .catch()，或直接使用 async/await + try/catch 提升可读性与健壮性。
总结：Promise 不是“不工作”，而是你只监听了成功路径。补上错误处理分支，就能让反馈如实呈现到页面上。
立即学习“Java免费学习笔记（深入）”；
