无法在Chrome开发工具中修改javascript

时间:2016-02-27 19:55:25

标签: javascript google-chrome google-chrome-devtools

我正在尝试编辑页面html中的一些javascript代码(不是导入的js文件)。我能够设置断点并逐步执行它们,但我无法在执行期间或执行之前/之后编辑javascript。我美化了({})并取消了美化文件。本节中没有缩小代码段。

  1. 我可以这样做吗?
  2. 代码是否在附加事件中是否重要?即点击等。
  3. 我明显使用jquery。
  4. 我本来可以发誓这是一个常见的功能。但是,自从我做了很多javascript以来已经过去了一年多。

1 个答案:

答案 0 :(得分:3)

使用铬/铬有几种方法可以修改现有html的{​​{1}}。在devtools

  • 选择document标签,右键单击要修改的元素,选择Elements,在包含元素的框架中进行修改,然后在编辑框外单击

  • 选择Edit as HTML标签,选择Sources标签,右键点击并选择Snippets,然后撰写New,即可在现有javascript内按{ {1}}在右侧面板中,在现有window的{​​{1}}中间面板中运行。例如,如果添加javascript作为Snippets点击window元素,则应调用$("body").on("click", function() {alert(123)})。在检查元素时,该事件也应该在devtools右侧面板的Snippet中列出。删除听众可能会更具挑战性;即使您将鼠标悬停在右侧面板上的监听器上时单击body,因为该事件已附加到该元素。最简单的方法是在事件alert(123)中添加Event Listeners,然后调用remove

  • 修改文本现有处理程序不会自动影响或取消先前附加到元素的事件处理程序。最简单的方法是复制并保存包含事件处理程序的现有namespace,选择$("body").on("click.abcnamespace", handler)选项卡,右键单击具有事件侦听器的元素,在右侧面板上选择$("body").off("click.abcnamespace"),将鼠标悬停在应显示javascriptElementsEvent Listeners事件附加按钮,显示window。单击该按钮可删除事件侦听器。然后,您应该能够修改已保存的事件侦听器,并将其添加回现有的document并应用修改