www.qjdy.com-奇迹赌场 > www.qjdy.com官网 > 上面的文章

原标题:上面的文章

浏览次数:141 时间:2019-10-05

Chrome调整台 如何调节和测量试验Javascript

2015/01/12 · JavaScript · Chrome

原稿出处: ctriphire   

地方的文章已经大致介绍了一晃console对象实际有哪些方面以及基本的施用,下边简介一下怎样运用好chrome调节台这一个神器好好调节和测量试验javascript代码(这么些才是大家真正能用到实处的地点)

1、先说一下源码定位

世家开垦测验网页   看见页面右下方有三个推荐介绍的Logo吗?右击推荐Logo,选拔调查成分,打开谷歌(Google)调节台,如下图所示

图片 1

大家前些天想驾驭votePost方法到底在哪?跟着自个儿这么做,在Console面板里面输入votePost然后回车

图片 2

直白点击上海教室标红的链接,调整台将定点到Sources面板中,呈现如下图所示

图片 3

世家看了地点这几个图片之后推测头都要晕了吧,这么多js都整在一行,令人怎么看呀,不用顾虑,按下图操作就可以(也便是点击中间面板左下方的Pretty print就行了)

图片 4

那会儿我们再回来Console面板时会惊喜的觉察原来的链接后边的1未来改为91了(其实这里的数字1要么91正是意味votePost方法在源码中的行号 )今后观看Pretty print开关的强大之处了吧

精晓了如何查看某八个按键的源码,那接下去的干活就是调整了,调节和测量试验第一步需求做的就是设置断点,其实设置断点不会细小略,点击一下上海图书馆所示的92就能够,那时你会发觉92行号旁边会多了二个Logo,这里解释一下为啥不在91处设置断点,你能够试下,事实上根本就无助在91处上安装断点,因为它是函数的定义处,所以没有办法在此设置断点。

图片 5

安装好了断点后,你就可以在侧面Breakpoints方框里看看刚刚安装的断点。

咱们先来介绍一下用到的调治快速键吧(事实上大家也得以不用下表所示的神速键,直接点击上海体育地方所示左侧栏最上层的一排按键来进展调治将养,具体用哪个按键,把鼠标放到开关上方一会就能显得它对应的提拔)

 

快捷键 功能
F8 恢复运行
F10 步过,遇到自定义函数也当成一个语句执行,而不会进入函数内部
F11 步入,遇到自定义函数就跟入到函数内部
Shift F11 步出,跳出当前自定义函数

其间值得说的是,当我们点击“推荐”按键进行调养的时候会发觉,不管大家是按的F10举办调整依然按F11进展逐级调节和测量检验,都无法进行$.ajax函数内部,固然大家在函数内部设置了断点也从不办法步向,这里按F8才是真的起效果的,不相信你试试。

当大家在调节和测验的时候,左侧Scope Variables里面交易会示当前作用域以及她的父级作用域,以及闭包。你不但能在右臂Scope Variables(变量功用域) 一栏处见到眼下变量,并且还是能把鼠标直接移到自由变量上,就足以查看该变量的值。

用图说话(哈哈)

图片 6

 

无独有偶我们介绍的只是在html里面能够看收获它绑定了onclick事件,那样我们就找到它绑定的js函数,假使它是在jQuery页面加载成功函数里面绑定的,那时候大家怎么明白它绑定的是哪个js函数呢,借使大家不知道绑定的js函数就越来越不用说调试进去了

上边介绍一下怎么查看,依然以刚刚那么些测量检验网页为例子吗,可是这一次大家来看“提交商议”作注脚呢,

右击“提交斟酌”–>调查成分,大家能够清楚的观看在那个开关上未绑定任何事件。在Console面板内输入如下代码

JavaScript

function lookEvents (elem) { return $.data ? $.data( elem, "events", undefined, true ) : $._data( elem, "events" ); } var event = lookEvents($("#btn_comment_submit")[0]); // 获取绑定的风云

1
2
3
4
function lookEvents (elem) {
    return $.data ? $.data( elem, "events", undefined, true ) : $._data( elem, "events" );
}
var event = lookEvents($("#btn_comment_submit")[0]); // 获取绑定的事件

如下图所示:

图片 7

依照上述介绍的格局定位到现实的blog-common.js里面,找到postComment  然后一稀缺的找到切实可行的代码,再安装断点就好了。

终极介绍一下一个神器,很好用的debugger

假令你本身写的代码,你试行的时候想让它在某一处停下来,只要写上的debugger就好了,不相信你试试!哈哈

赞 1 收藏 评论

图片 8

本文由www.qjdy.com-奇迹赌场发布于www.qjdy.com官网,转载请注明出处:上面的文章

关键词: bbin平台大全 JavaScript

上一篇:Web 开发 17 年的所见所得

下一篇:没有了