[英]How can I use chrome dev tools to pinpoint the cause of elements on my page shifting?
我页面顶部的某些内容导致内容布局发生重大变化。 内容呈现，然后像 300px 一样向上跳跃，然后向下跳回到它的正常位置。
我曾尝试单步执行代码，但这似乎只有在您知道希望代码停止的位置时才有用。
如何使用开发工具有效地定位导致此问题的 javascript 和/或元素？
使用 Chrome 中的性能工具，您可以记录您的会话。 您可以将鼠标悬停在屏幕截图上，直到您看到页面发生变化。 在这种情况下，就像跳跃发生一样，你会看到一个“onLoad”事件
这可能表明页面加载事件上有一些 javascript 加载会改变您的样式？
单击匿名函数或任何这些事件将允许您在摘要中查看源代码中发生这种情况的位置。
然后，您可以在发生这种情况的代码中设置断点。 （单击行左侧的行号）
继续尝试直到你发现可能是你的问题
如何在 Chrome 开发工具或 Firefox 开发工具中查看哪些 JS 改变了我的元素的样式？
[英]How do I see what JS is changing style to my elements in Chrome dev tools or Firefox dev tools?
如何使用Chrome开发工具来调试动态添加到页面的head元素的javascript标签？
[英]How to use Chrome dev tools to debug javascript tag added dynamically to a page's head element?
如何使用Chrome浏览器开发者工具调试网页上的脚本？
[英]How can I debug the scripts on my web page using the Chrome browser developer tools?
Chrome Dev Tools脚本注入可以在页面重新加载后继续运行
[英]Chrome Dev Tools script injection that can survive page reload
我的 IDE 和 HTML 中的 HTML 在检查时如何
[英]how can the HTML in my IDE and HTML in chrome dev tools when inspected differ
如何在Chrome开发工具中使用其他行断点标记？
[英]How do I use the additional line breakpoint markers in Chrome Dev Tools?
如何使用 JavaScript（来自 Dev Tools）在 Chrome 中保存完整页面？
[英]How to save a complete page in Chrome using JavaScript (from Dev Tools)?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
