在遇到一个 bug 时，我会先通过浏览器控制台查看是否有 JavaScript 错误，再通过网络面板检查接口请求是否成功。如果请求失败，我会进一步查看后端日志和接口实现，确认是否是后端服务的问题；如果请求成功但页面没有正确显示，我会检查前端代码逻辑和 DOM 结构，判断是否是前端渲染问题。通过这样的分步排查，我可以快速定位问题来源。

步骤详解

在开始定位 bug 前，首先要确认以下几点：用户描述是否清晰？Bug 的表现形式是什么？查看浏览器控制台（Console），检查网络请求（Network），检查 DOM 结构与样式，模拟用户操作，查看后端日志，使用工具测试接口，检查数据库操作。定位 bug 是前端还是后端的核心逻辑是：通过 请求链路 和 错误信息 来判断问题源头。

另一个回答示例

首先，打开浏览器开发者工具，查看Console tab是否有前端JS报错。如果有JS错误，那基本就是前端问题。如果没有，再看Network tab，检查所有接口请求的状态码和响应数据。如果某个接口返回了4xx或5xx错误，或者响应数据格式不对，那就是后端问题。如果接口都正常返回数据，但页面没渲染出来，那就是前端渲染逻辑问题。

实际案例

假设有一个 bug：点击按钮后页面没有更新。我会先检查控制台有没有错误，没有的话看Network，假如请求是200但数据没变，那可能是后端没处理好逻辑；如果数据变了但页面没更新，那就是前端的状态管理或渲染问题。用Postman单独测接口，就能确认。

工具使用

前端用Chrome DevTools，后端看日志如Nginx、应用日志，或者用Kibana之类的日志系统。还可以用Fiddler或Charles抓包，看请求全程。数据库用EXPLAIN看慢查询。

系统性方法

1. 复现bug；2. 看前端控制台和网络；3. 接口正常则前端问题，反之后端；4. 前端问题细分JS/CSS/DOM；5. 后端问题看日志、代码、DB。

FAQ

Q: 如果接口超时是怎么回事？
A: 通常是后端服务慢或网络问题，先查后端性能和日志。

Q: 前端没报错但页面卡住怎么办？
A: 检查Performance面板，看是JS执行慢还是渲染阻塞，多是前端代码问题。

Q: 怎么区分是缓存问题还是bug？
A: 硬刷新Ctrl+F5清缓存，或者查响应头Cache-Control。

Q: 团队协作怎么定位？
A: 先本地复现，记录截图日志，发给对应端开发确认。