有哪些js调试技巧?

author author     2023-04-17     588

关键词:

其实当你经验足够的时候,有些错误不需要调试就能想明白。当然,新手而言,从调试做起。

主要的技巧取决于你使用的调试工具,这里以我使用的chrome为例。首先跳出chrome的调试工具,右键选择检查。。

接着弹出开发者窗口,如图

这个就是调试页面了,然后单击顶头的source,找到你的js脚本,如图:

图片中那个蓝色的小框框就是断点了,设置方法就是单击那里。

可以见到,窗口下面红色鲜红的值就是错误了,单击后面的错误位置就能定位了(语法错误能显示定位,但是逻辑错误无法定位。内置api出错定位会出错,比如JSON.parse()出错就定位到html文件去了)

左下角有一个蓝色小箭头,后面是能输入的,输入一下试试,

我输入了cookie,就返回了cookie的值。其他的同理。

另外也可以在js脚本里面使用console.log(),在console一栏会显示的。更多的方法,尝试才知道。

参考技术A 火狐浏览器可以用firebug,

chrome调试折腾记_js断点调试技巧

JS调试技巧技巧一:格式化压缩代码技巧二:快速跳转到某个断点的位置右侧的Breakpoints会汇总你在JS文件所有打过的断点,点击跟checkbox同一行的会暂时取消这个断点,若是点击checkbox下一行的会直接跳转到该断点的位置技巧三... 查看详情

深度学习调参都有哪些技巧

深度学习调参有哪些技巧?下面就分享一些自己的深度学习模式调试技巧(主要是CNN)。由于某些需要,我最近参加了一些CNN建模和调优任务。由于我个人的习惯,我不习惯深度调试,通过一个简单的试错法学习模式,往往给人... 查看详情

js调试必备的5个debug技巧

...; debugger语句用于停止执行JavaScript,并调用(如果可用)调试函数。使用debugger语句类似于在代码中设置断点。通常,你可以通过按下F12开启调试工具,并在调试菜单中选择"Console"。进入断点后,可以双击下面的某行代码,设新断... 查看详情

在uiwebview中调试javascript有哪些方法?

我试图找出为什么使用Javascript的东西在UIWebView中不起作用。据我所知,没有办法在XCode中为js文件设置断点。没问题,我将回到2004年并使用警报状态-哦等等他们似乎也不在UIWebView内部工作!我唯一能想到的是将我的HTML和JS文件... 查看详情

如何掌握谷歌的chromedevelopertool调试技巧

...这时候在设定断点可读性就大大提高了.2.查看元素绑定了哪些事件在Elements面板,选中一个元素,然后在右侧的EventListeners下面会按类型出这个元素相关的事件,也就是在事件捕获和冒泡阶段会经过的这个节点的事件.在EventListeners右... 查看详情

电子邮件营销技巧有哪些?五大趣味技巧分享!

...是维护客户的长久之计。那么,电子邮件营销技巧有哪些呢?下面就跟着摩杜云小杜一起来看看吧!电子邮件营销技巧有哪些?五大趣 查看详情

在特定状态下调试浏览器的建议和技巧?

】在特定状态下调试浏览器的建议和技巧?【英文标题】:Suggestion&Tipstodebugthebrowseronspecificstate?【发布时间】:2014-07-1611:23:44【问题描述】:是否有在特定状态下调试浏览器的解决方案?举个例子:我想将typeahead.js与twitterboot... 查看详情

提交 Grails 表单都有哪些方便的技巧?

】提交Grails表单都有哪些方便的技巧?【英文标题】:WhataresomehandytricksforsubmittingGrailsforms?提交Grails表单有哪些方便的技巧?【发布时间】:2011-11-2901:44:19【问题描述】:每个人都知道通过html表单向控制器传递参数:<g:formactio... 查看详情

#前端浏览器调试工具使用技巧(代码片段)

前端浏览器调试工具使用技巧文章目录前端浏览器调试工具使用技巧调试hover后出现的元素方法一方法二JS断点调试debugger方式直接在调试窗口打断点浏览器快捷键Console使用Overrids使用本地Js替换服务上的JsF12ctrl+shift+p调出命... 查看详情

eclipse中处理jsp文件的常用技巧都有哪些?

】eclipse中处理jsp文件的常用技巧都有哪些?【英文标题】:Whatarethecommontricksineclipsewhenworkingwithjspfiles?eclipse中处理jsp文件的常用技巧有哪些?【发布时间】:2009-08-1419:20:05【问题描述】:我查看了“Hidden”features/tricksforEclipse?"的... 查看详情

console调试技巧(代码片段)

...也表达得更加直观,更加丰富多彩,下面我们就来看看有哪些实用的方法吧!1、console.log()我们经常会使用console.log来打印出某个变量的值或者某个实体对象,也可以传入多个变量参数,它会按照传入顺序进行打印:1.传入一个变... 查看详情

短信发送平台的推广技巧有哪些?3个小技巧要记牢

...0c;下面就让小杜来跟大家讲讲短信发送平台的推广技巧有哪些&#x 查看详情

继续分享5个实用的vs调试技巧(代码片段)

继续分享5个实用的vs调试技巧原总结调试vs2019vs前言我在上一篇文章《5个非常实用的vs调试技巧》中分享了5个我认为非常值得了解的vs调试技巧,本周继续分享5个很基础但同样实用的调试技巧。1.条件断点作用简介:顾名思义,... 查看详情

c语言有这个就够了七.实用调试技巧

...什么是BUG历史上第一个bug导致程序运行错误的对象(二)调试是什么调试就是破案的过程,因为有人写代码是这样的:1.调试又称除错,是发现和减少计算机程序或电子仪器设备中程序错误的一个过程。2.调试的基本步骤发现错... 查看详情

参考博客:java断点调试技巧

Java断点调试技巧:如何调试Java程序?大家最开始学习Java,都会觉得IDE调试好高端有木有,其实很简单了。下文会尽量简单直观的教会你在Eclipse中调试,其他的IDE调试步骤也是类似的。1.在你觉得有错的地方设置断点。在代码行... 查看详情

毕业季:应届程序员求职该做哪些准备?有哪些面试必备小技巧?

前言应届毕业生在找工作过程对于简历设计和面试技巧有一定的欠缺,这对于求职是比较重要的两个因素,因此掌握一定的面试技巧对于找互联网技术岗位的工作帮助非常大。接下来我们就一起来分析一下~求职互联网技... 查看详情

ios崩溃调试的使用和技巧总结

...写一篇博客总结一下我对崩溃调试的使用和技巧,如果有哪些错误或遗漏,还请指点,谢谢!获取崩溃信息在iOS中获取崩溃信息的方式有很多,比较常见的是使用友盟、百度等第三方分析工具,或者自己收集崩溃信息并上传公司... 查看详情

web前端学习技巧有哪些?本文给你答案

...多人都开始报班学习web前端技术.那么web前端学习技巧有哪些?来看看下面的详细介绍。web前端学习技巧有哪些?1.编程思维学习web前端开发的核心是一个“编程思想”,因为每一段代码都是不同的,需要看另外,只要你掌握... 查看详情