求助：JavaScript代码无法按顺序显示文本，如何实现先后展示？

原代码的问题 #

• JavaScript 没有内置的 wait() 函数，直接调用会抛出 ReferenceError 错误。
• 即便存在同步等待方法，这种写法会阻塞浏览器主线程，导致页面无法实时更新 output 内容——用户看不到"turning off"，3秒后直接显示最终的"off"。
• 换行符写法错误：/n 应该改为 \n（反斜杠），否则会直接显示字符"/n"。

修正后的代码 #

使用浏览器提供的异步定时器 setTimeout()，它不会阻塞主线程，能让UI先更新为"turning off"，再在3秒后执行后续文本替换：

修正后的JavaScript代码

const output = document.getElementById('output');

function off() {
  output.innerText = 'turning off';
  // 3秒后执行更新操作
  setTimeout(() => {
    output.innerText = '\n off';
  }, 3000);
}

完整HTML代码

<!DOCTYPE html>
<html>

<head>
  <script src="script.js"></script>
</head>

<body>
  <button onclick="off()">press me to start</button>
  <p id="output">Fun game</p>
</body>

</html>

补充说明 #

• 给output变量加上const声明，避免污染全局作用域。
• setTimeout()的第一个参数是延迟执行的回调函数，第二个参数是延迟毫秒数（3000即3秒）。浏览器会先完成当前UI更新（显示"turning off"），再在指定时间后执行回调里的文本替换。

内容的提问来源于stack exchange，提问作者sewqq