我如何在Chrome调试器中“动态”编辑JavaScript代码?它不适合我,所以我没有权限访问源文件。我想编辑代码,看看它们对页面有什么影响,在这种情况下,阻止动画排队一堆次。
当前回答
我正在寻找一种方法来更改脚本并调试新脚本。我的方法是:
在要更改和调试的脚本的第一行中设置断点。 重新加载页面,以便击中断点 粘贴新脚本并在其中设置所需的断点 Ctrl+s,页面将刷新,导致第一行中的断点被击中。 F8继续,现在你新粘贴的脚本替换原来的一个,只要没有重定向和重新加载。
其他回答
Chrome覆盖
在sources面板中打开JS文件。
右击脚本src URL >显示在源代码面板
确保选中“启用本地覆盖”。
右键单击JS文件>保存覆盖的任何地方
都准备好了!
只需编辑文件,并使用CMD/CTRL + s保存。现在无论何时刷新页面,它都会使用修改后的文件。(只要文件名不变)
如果您在文件图标中看到一个紫色的点,您就知道它正在工作。
就像@mark的回答一样,我们可以在Chrome DevTools中创建一个snippet,来覆盖默认的JavaScript。最后,我们可以看到他们对页面的影响。
我今天偶然发现了这个,当时我正在浏览别人的网站。
我意识到我可以在我想动态编辑的代码行之前,在调试器中附加一个断点。由于断点在重新加载页面后仍然存在,所以我可以在断点暂停时编辑我想要的更改,然后继续让页面加载。
所以作为一个快速的解决方法,如果它适合你的情况:
在脚本中较早的位置添加断点 重新加载页面 将更改编辑到代码中 CTRL + s(保存更改) 取消暂停调试器
Chrome DevTools有一个片段面板,你可以创建和编辑JavaScript代码,就像你会在一个编辑器,并执行它。 打开DevTools,然后选择Sources面板,然后选择Snippets选项卡。
https://developers.google.com/web/tools/chrome-devtools/snippets
下面是我在chrome中编写的js调试器的温和介绍。也许它会帮助其他人寻找这方面的信息:http://meeech.amihod.com/getting-started-with-javascript-debugging-in-chrome/
推荐文章
- 给一个数字加上st, nd, rd和th(序数)后缀
- 如何以编程方式触发引导模式?
- setTimeout带引号和不带括号的区别
- 在JS的Chrome CPU配置文件中,'self'和'total'之间的差异
- 用javascript检查输入字符串中是否包含数字
- 如何使用JavaScript分割逗号分隔字符串?
- 在Javascript中~~(“双波浪号”)做什么?
- 谷歌chrome扩展::console.log()从后台页面?
- 未捕获的SyntaxError:
- [].slice的解释。调用javascript?
- jQuery日期/时间选择器
- 我如何预填充一个jQuery Datepicker文本框与今天的日期?
- 数组的indexOf函数和findIndex函数的区别
- jQuery添加必要的输入字段
- Access-Control-Allow-Origin不允许Origin < Origin >