在Chrome上面按F12修改页面的源代码里面的JS代码为啥无法生效

Posted 2023-03-21

需要按ctrl+s进行保存。 并且重新执行这段代码。 如果该代码在函数里面，重新执行函数就行，如果该代码在全局作用域，或者页面加载执行。 那就没辙了。 因为你刷新的话，代码就会重置。 而且有时候更改关键地方的代码，会使当前页面崩溃。 最好用debug调试，然后在在源文件里面改 参考技术A 需要按ctrl+s进行保存才会生效

在Chrome上面按F12修改页面的源代码里面的JS代码为啥无法生效

在Google Chrome浏览器中，按F12进入的是本地调试界面。
在F12调试界面中修改的JS代码，是修改的“本地缓存文件”中的代码，而不是存在于服务器上的网页的真正代码，网页的真正代码在浏览器中是无法修改的。
Chrome开发者调试工具（F12），可以在调试界面修改代码（包括JS、HTML和CSS）模拟本地运行，具体步骤大致如下：
在需要修改的代码段上方合理代码行设置断点；
按F5键刷新网页，并等待网页执行到断点；
修改JS代码或其它需要修改的代码，修改后选择单步执行或继续执行即可。
通常，调试中修改无效，是因为网页加载完成，其实就是运行已经完成了，修改代码不会再次执行。 参考技术A

在Google Chrome浏览器中，按F12进入的是本地调试界面。

在F12调试界面中修改的JS代码，是修改的“本地缓存文件”中的代码，而不是存在于服务器上的网页的真正代码，网页的真正代码在浏览器中是无法修改的。

Chrome开发者调试工具（F12），可以在调试界面修改代码（包括JS、HTML和CSS）模拟本地运行，具体步骤大致如下：

在需要修改的代码段上方合理代码行设置断点；

按F5键刷新网页，并等待网页执行到断点；

修改JS代码或其它需要修改的代码，修改后选择单步执行或继续执行即可。

通常，调试中修改无效，是因为网页加载完成，其实就是运行已经完成了，修改代码不会再次执行。

参考技术B js代码在页面渲染的时候已经执行了，就是说从请求一个页面到完整看到一个页面之后，这个页面相关的js代码已经执行完毕，下次执行的时候依然是页面再次刷新加载的时候。f12修改代码刷新后还是会变回原来的代码，再次执行的还是原来的代码。 参考技术C

修改原代码后要 Ctrl + S保存

页面不可以刷新, 也就是说被修改的文件不可以重新加载, 否则所有修改内容都会被重置

文件修改后, 文件中的脚本会被执行一次, 执行不到的位置当然不会生效

参考技术D 　　试试这样：你只要F12打开开发者工具，点击右下角的齿轮“设置”按钮进入下一界面，选中General选项卡中的Disable cache (while DevTools is open) 就行了。