JS跳过debugger的几种方法小结

 更新时间:2023年07月07日 16:48:35   作者:爬楼梯的巨人  
本文主要介绍了JS跳过debugger的几种方法小结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

js中通常用debugger关键字来实现无限循环。

debugger 语句用于停止执行 JavaScript(以下简称JS),并调用 (如果可用) 调试函数。
使用 debugger 语句类似于在代码中设置断点。

注意: 如果调试工具不可用,则调试语句将无法工作。也就是说只有在打开调试工具的时候才会触发debugger语句 

方法1:禁用所有断点

禁用所有的断点,会包含自己的断点也会被禁用掉,暂停了调试。

来一个实例,网址是:https://antispider8.scrape.center/,打开网站进入开发者工具(此处我使用的是谷歌浏览器),发现其立即进入断点模式。

这种方法不太好,禁用了全局断点,就无法对其他地方进行断点调试了。 

方法2:添加到 Ignore List 中

把需要忽略掉的断点被包含的文件,添加到忽略列表中,此时一部分的断点就会被跳过,使用 f5 刷新也不会影响。

鼠标放到 debugger 处,点击右键

选择添加到 ignore list ,然后去配置信息,如图:

方法3:设置 Never pause here

我们在debugger关键字的行号上单击右键,出现下面的选项卡

 点击 Never pause here 选项意思不会在这里停留,这时候页面变成如下样子

 这时候会发现在断点变成橙色并且在断点处出现一个?符号,这时再次点击 Resume script execution 会发现页面不在进入无限 debugger 模式了

方法4:Add conditional breakpoint

在上一个方法中,通过点击 Never pause here 来实现的,在选项卡还有一个Add conditional breakpoint 选项,这个选项用来设置进入断点的条件。在本案例中可以直接填入false,效果与上述方法 Never pause here 一致。

方法5:重写函数

浏览器调试工具为我们提供了 overrides 这个功能可以实现我们的目的。

点击加号会出现让我们选择文件夹,用于存储要替换的js文件,这里我选择是Chrome文件夹

选择后会出现这样一个提示,点击允许即可

找到debugger所在js文件,

 代码不易可读,其实调试工具中为我们提供了格式化代码的功能,在其左下角中有一个{}便是格式化按钮。点击完后会在其旁边打开一个带有format文件名的文件

复制这个文件的内容到文本编辑器中修改后,再次将修改后的内容复制到不带format的文件中去替换原有文件(带有format的文件是格式化的,不能被修改)并按Ctrl+S进行保存,会发现在Chrome文件夹下生文件

下面的简写的方式也能实现

找到包含 debugger 的方法,在控制台内重写并替换方法,将其 debugger 去掉。

方法名 = function(){  }
或
function 方法名(){   }

跳过 debugger 复制在调试器中的代码就能流畅执行了,可以自由的执行你的自动脚本 

到此这篇关于JS跳过debugger的几种方法小结的文章就介绍到这了,更多相关JS跳过debugger内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:

相关文章

  • JavaScript闭包原理及作用详解

    JavaScript闭包原理及作用详解

    闭包是指内部函数总是可以访问其所在的外部函数中声明的变量和参数,即使在其外部函数被返回(寿命终结)了之后。这篇文章将为大家详细介绍一下闭包的原理,作用及用途,快来跟随小编一起学习一下吧
    2021-12-12
  • 基于zepto.js实现手机相册功能

    基于zepto.js实现手机相册功能

    这篇文章主要为大家详细介绍了基于zepto.js实现手机相册功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • requireJS模块化实现返回顶部功能的方法详解

    requireJS模块化实现返回顶部功能的方法详解

    这篇文章主要介绍了requireJS模块化实现返回顶部功能的方法,结合实例形式详细分析了requireJS的使用步骤及返回顶部功能的相关操作技巧,需要的朋友可以参考下
    2017-10-10
  • JavaScript使用DeviceOne开发实战(四)仿优酷视频应用

    JavaScript使用DeviceOne开发实战(四)仿优酷视频应用

    这篇文章主要介绍了JavaScript使用DeviceOne开发实战(四)仿优酷视频应用的相关资料,需要的朋友可以参考下
    2015-12-12
  • js借助ActiveXObject实现创建文件

    js借助ActiveXObject实现创建文件

    创建文件的方法有很多,在本文为大家详细介绍下js中时如何实现的,感兴趣的朋友不要错过了
    2013-09-09
  • 微信小程序实现页面导航与传参功能详解

    微信小程序实现页面导航与传参功能详解

    这篇文章主要为大家详细介绍一下微信小程序实现页面导航的几种方法以及帮助大家掌握微信小程序如何进行传递参数,感兴趣的朋友可以了解一下
    2022-08-08
  • web css实现整站样式互相切换

    web css实现整站样式互相切换

    css轻松实现整站样式互相切换。需要的朋友可以过来参考下,希望对大家有所帮助
    2013-10-10
  • JavaScript相等判断的避坑实战指南

    JavaScript相等判断的避坑实战指南

    JavaScript中的相等性判断,在项目开发中,我经常会遇到,今天我们一起探讨下,下面这篇文章主要给大家介绍了关于JavaScript相等判断的避坑实战指南,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2022-08-08
  • angular之ng-template模板加载

    angular之ng-template模板加载

    本篇文章主要介绍了angular之ng-template模板加载,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-11-11
  • JavaScript中for of和for in的区别详解

    JavaScript中for of和for in的区别详解

    对于初学者,我们或许只知道无论是for of还是for in他们都有一个功能那就是遍历,至于具体的细节或许我们不是很清楚,那么接下来我们就来详细的区分一下for of和for in他们之间的不同点和相同点,需要的朋友可以参考下
    2023-06-06

最新评论