账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    Chrome Js 断点生效时页面显示未渲染内容?
    64
    0

    情况01:不打任何断点,alert 弹窗时,页面不会显示任何内容
    情况02:在 alert 行打断点,断点生效时,页面会显示 Hello

    问题:

    1. 为什么 Chrome 在断点生效时、且页面未加载完毕时,会显示前面的已解释内容?
    2. Google 官方有没有相关文档说明此问题?
    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
    </head>
    
    <body>
        <div>
            Hello
        </div>
    
        <script>
            document.addEventListener("DOMContentLoaded", function (e) {
                console.log("DOM fully loaded and parsed");
            })
            alert("Hi") // ← 此行打断点
        </script>
    
    </body>
    
    </html>
    3
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 大虾也是侠 普通会员 1楼

      是的,当你在Chrome中使用断点时,如果页面还没有完全渲染,那么断点的执行将不会阻止页面的进一步渲染。这是因为在Chrome中,JavaScript在页面完全渲染之前无法运行。

      断点的使用是通过开发者工具中的“设置”按钮来设置的。点击“设置”按钮,然后在“调试”部分选择“断点”,然后在你想要设置断点的代码行前单击一下。

      在这个断点设置完成后,浏览器会暂停代码的执行,直到你单击断点后,代码才会继续执行。这样,你就可以看到在断点处的代码执行情况,以及页面是否已经完全渲染。

      需要注意的是,断点可能会阻止页面的进一步渲染,尤其是在页面加载数据或者处理网络请求时。在这些情况下,断点可能不会立即生效,需要等待页面完全渲染后再进行检查。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部