Question

是否可以使用Google Chrome的Inspect Element编辑网页的JavaScript代码？

例如，如果我打开一个简单的网页，打开Inspect Element，并在段落和标题内更改文本等内容，则更改会立即反映在网页上，并且只要我不重新加载页面就会保留。

同样，我试图对JavaScript代码进行一些更改（真正简单的代码没有连接到任何服务器），但更改没有生效（我所做的是编辑一个按钮激活的功能，所以它做了{ {1}}而不是在空白段落元素中显示文本）我很确定这是可行的，而且我错过了一些东西。

我完全清楚我可以保存网页并用它的代码做任何我想做的事情，但我只是看看我是否也可以这样做。

Answer 1

您可以通过控制台注入javascript方法。这将产生相同的效果，并且还允许您相当容易地复制/粘贴新方法，而不是每次刷新页面时手动编辑JS文件。例如，打开控制台并将以下内容粘贴到（在此页面上）：

$('p').on('click', function(){alert("clicked paragraph")});

现在点击一个段落，您将看到警报。

Answer 2

当然，你可以。打开＆＃34;来源＆＃34;开发人员工具中的选项卡。

然后，在左侧的源树中找到您的文件。选择一个文件，编辑并使用 Ctrl + S 进行保存，Chrome会将原始文件替换为您的文件。

您还可以点击底部的 {} 图标来美化JS并使其更易于编辑和调试。

请注意，它仅适用于.js个文件。您无法使用此方法修改内联脚本。