js脚本和dom操作是分开执行的

首先上一张偶然遇到问题的图

原理：js脚本与dom操作是分开执行的。

x.innerText、x.outerHTML和更改文本节点的操作会被扔到一个微任务队列里，即dom操作队列。因此控制台看到的后两项输出是顺序输出。但当dom操作全部执行完后，dom对象的文本内容已经变为10，因此js脚本打印出来的都是一个对象的同一时刻版本。