关于脚本中断执行及WHATWG规范prepare the script element算法的疑问

你提到的规范条款对应的是动态插入的同步脚本在当前脚本执行过程中被强制执行的场景，最常见的触发方式是通过document.write在运行中的脚本里写入新的<script>标签。

举个直观的代码示例：

console.log('脚本A启动');
document.write('<script>console.log("脚本B正在执行");<\/script>');
console.log('脚本A恢复执行');

这段代码的实际执行顺序是：

1. 打印脚本A启动
2. 执行document.write插入新脚本，触发"prepare the script element"算法
3. 立刻暂停脚本A的执行，优先执行新插入的脚本B，打印脚本B正在执行
4. 脚本B执行完成后，回到脚本A的暂停点，继续打印脚本A恢复执行

关于“暂停”其他脚本的原理 #

JavaScript是单线程执行模型，所有脚本的执行都依赖同一个调用栈。当规范要求“立即执行”新脚本时，浏览器会把这个新脚本的执行任务插入到当前调用栈的顶部，直接抢占执行权。这不是异步式的暂停（比如await那种挂起），而是单线程下的执行顺序插队——同一时间只能有一个任务在调用栈中运行，新脚本的立即执行会优先占用执行资源，等它跑完，原脚本才会继续。

另一个类似场景是动态创建<script>元素且不设置async/defer属性，直接插入DOM：

console.log('主脚本开始');
const script = document.createElement('script');
script.textContent = 'console.log("动态脚本执行中")';
document.body.appendChild(script);
console.log('主脚本结束');

符合规范的浏览器会立即打断主脚本，先执行这个动态插入的脚本。

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