alert 为什么会比它上一条语句先执行

最新推荐文章于 2023-02-02 12:13:27 发布

原创最新推荐文章于 2023-02-02 12:13:27 发布 · 2.6k 阅读

3 ·

本内容遵循CC 4.0 BY-SA版权协议

JavaScript 专栏收录该内容

23 篇文章

订阅专栏

本文探讨了HTML与JavaScript在浏览器中的执行顺序问题。通过一个简单的示例说明了为何JavaScript的alert函数会在HTML元素渲染之前执行，揭示了GUI渲染线程被阻塞的现象及其原因。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>

    </head>
    <body>

        <div style="background-color: red;">
            显示
        </div>
        <script>
            alert("aa");
        </script>

    </body>
</html>

上面的代码按照道理是先显示出div的内容,再alert,但是实际上是先alert的,然后显示的div的内容,这是因为:div加载到页面需要时间,还没等加载到页面就执行到alert了,此时alert会阻塞线程,这里阻塞的是GUI渲染线程.所以等alert执行完毕后这个线程才会继续执行,将div内容显示到页面上.