首页/文章/浏览器

chrome调试工具overrides调试代码

2024-12-16
4242 分钟
...

利用Chrome开发者工具断点调试功能调试修改代码,一刷新就什么都没有了,且只能调试JS代码,太尴尬了。

想刷新后,原来修改调试的的代码还在,且JSP、JS、CSS等能调试,那赶快试试下面这种方法吧。

第一步:

在浏览器开发者工具中打开下面的面板sources-->overrides!

第二步:

打开Select folder for overrides,选择要存放代码的文件夹

第三步:

点击允许访问文件夹,overrides生成刚才选择的文件夹

第四步:

在Network中选择一个文件,右击 Override content 修改文件,并按ctrl+s保存,就会在本地生成对应页面的代码。

第五步:

刷新页面,即可在页面上看到修改的内容

  第六步:

如果想去掉修改的内容,删除对应修改的内容或直接删除本地文件,再刷新即可。

如果你不想运行代码或没有源码而想通过浏览器调试代码,或者在生产环境有问题时需要定位找原因时,那用上述方法调试真是太方便了!


如果您觉得这篇文章有帮助,请点个赞吧~

分享文章

相关文章

更多文章 →
浏览器2025-07-30
浏览器内核到底有哪些?它们各自又有什么区别?
这问题其实很多刚入行的同学经常搞混,所以今天我来一次性讲明白—— 浏览器内核 到底有哪些?它们各自又有什么区别? 说白了,浏览器内核就是浏览器的大脑,分两部分: 渲染引擎(Rendering Engine) :负责网页的排版渲染,HTML、CSS统统交给它。 JS引擎(JavaScript Engine) :处理JavaScript脚本逻辑,比如你点按钮后弹出对话框这种行为。 1)常见浏览器内核盘点 下面我直接列几个主流的浏览器内核,顺...
学习面试
浏览器2025-03-07
浏览器缓存及优化手段
前言 当我们通过url首次访问某个网站的时候,我们如果使用浏览器的工具查看网络请求,会发现有很多http请求,但是当我们下一次再访问时,这些请求都不会发送而是展现在了页面上,而这就是浏览器缓存发挥的作用。 浏览器缓存 浏览器缓存是指将页面长时间不更新的资源缓存到浏览器上,下次访问页面时该部分长时间不更新的资源直接从缓存中获取,从而减少了网络请求次数,提高了页面的加载速度。浏览器的缓存方式主要分为两种: 强缓存 和 协商缓存 ,下面将为大...
学习面试
浏览器2024-09-13
震惊!🐿浏览器居然下毒
发生什么事了 某天,我正在愉快的摸鱼,然后我看到测试给我发了条消息,说我们这个系统在UC浏览器中有问题,没办法操作,点了经常没反应(测试用得iPhone14,是一个h5的项目)。我直接懵了,这不是都测了好久了吗,虽然不是在uc上测得,chrome、safari、自带浏览器等,都没这个问题,代码应该是没问题的,uc上为啥会没有反应呢?难道是有什么隐藏的bug,需要一定的操作顺序才能触发?我就去找了测试,让他重新操作一下,看看是啥样的没反应...
学习
浏览器2024-09-10
深入理解浏览器的事件循环机制
在现代Web开发中,JavaScript作为浏览器中最常用的编程语言,其执行机制深刻影响着Web应用的性能和用户体验。事件循环(Event Loop)作为JavaScript处理异步操作的核心机制,是理解JavaScript执行模型的关键。本篇文章从多个维度去分析事件循环的机制,希望可以帮大家更加深入的了解它。 在讨论事件循环之前,理解浏览器的执行环境是至关重要的。浏览器是一个多线程环境,包含以下主要线程: GUI 渲染线程(GUI R...
学习面试
浏览器2024-09-02
优化浏览器渲染主线程的 api 都有哪些?怎么用?
为了提高浏览器的性能和用户体验,现代浏览器采用了一些技术来优化主线程的执行。主要有: setTimeout 延迟加载 (使用不当可能适得其反) web worker 多线程 (不能操作dom,主要计算密集型的任务) requestIdleCallback 帧空闲时运行 (react18带🔥的,低优先级任务) requestAnimationFrame 每帧都会运行 (主要做动画效果调优) setTimeout 延迟加载非常常见,但是它...
学习面试
浏览器2024-08-31
谷歌浏览器已经是多进程架构,为何在控制台写死循环语句依旧会卡死呢?
之前在分享谷歌浏览器的架构的时候,结合查到的资料来看,给到观众下面的信息: 谷歌浏览器的多进程架构可以解决单进程架构的不稳定的问题。由于进程是相互隔离的,所以当一个页面或者插件崩溃时,影响到的仅仅是当前的页面进程或者插件进程,并不会影响到浏览器和其他页面,这就完美地解决了页面或者插件的崩溃会导致整个浏览器崩溃,也就是不稳定的问题。 被问了那么一个问题,那“为何在控制台写死循环,浏览器依旧会卡死?” 借着这个问题,我们来再进一步研究背后的...
学习

评论

请登录后发表评论

去登录
加载评论中...