原文：http://www.cnblogs.com/52cik/p/js-console-show-source.html

在控制台输入要查找的函数名如votePost 然后回车：

函数源码粗显啦，并且在右下角有个链接 blog-common.js?v=WE8o1xrgcTu07QVvwYqERqD7AA8fdJp_dgoE-crAT3k1:1 这个是什么意思呢？
后面的 v=WE8o1xrgcTu07QVvwYqERqD7AA8fdJp_dgoE-crAT3k1 直接忽略好了这是版本号，防止缓存的。
blog-common.js:1
blog-common.js 是这个函数所在的js文件，1 是代码所在的行号。

直接点击这个链接，就可以跳转到 Sources 面板，这个就是源码面板，调试最重要的一个功能，之后会慢慢介绍。

可是所有代码都在一行，我们改怎么看? 4946 个字符呢，全缩在一行上。。
chrome 给我们提供了一个代码格式化的功能，点击下方那个 Pretty print 按钮即可格式化代码。

格式化完毕之后就是非常美观的代码了，至于看不看的懂，那是另一回事了。
有的看不懂可能是代码被UglifyJS，Google's Closure之类的工具编译过，如 jquery.min.js 文件。
如果格式化够找不到函数所在位置，也不要着急，有我在，慌啥？回到刚才控制台面板。


你欣喜的发现，blog-common.js?v=WE8o1xrgcTu07QVvwYqERqD7AA8fdJp_dgoE-crAT3k1:91
行号变成 91 了，现在再点击这个链接，就可以跳转到对应格式化后的位置了，是不是超方便。。

今天的内容差不多就这些了，其实现在很少有直接全局函数给你调试的，因为现在 jQuery 风靡，各种 click, on 之类的事件绑定，导致源码定位非常繁琐。
好在我之前写了一篇，比较详细的分析了这个问题，详情请参阅《浅谈 jQuery 事件源码定位问题》

js调试-定位到函数所在文件位置的更多相关文章

  1. python之sys._getframe() 用于查看函数被什么函数调用以及被第几行调用及被调用函数所在文件

    import sys def get_cur_info(): print(sys._getframe().f_code.co_filename) # 当前文件名,可以通过__file__获得 prin ...

  2. linux 显示当前所在文件位置 以及git 分支所在

    function git-branch-name {  git symbolic-ref HEAD 2>/dev/null | cut -d"/" -f 3}function ...

  3. js调试系列: 源码定位与调试[基础篇]

    js调试系列目录: - 如果看了1, 2两篇,你对控制台应该有一个初步了解了,今天我们来个简单的调试.昨天留的三个课后练习,差不多就是今天要讲的内容.我们先来处理第一个问题:1. 查看文章下方 推荐 ...

  4. js调试系列: 控制台命令行API

    js调试系列目录: - 上次初步介绍了什么是控制台,以及简单的 console.log 输出信息.最后还有两个小问题,我们就当回顾,来看下怎么操作吧. 先打开百度,然后按 F12 打开后,如果不是 C ...

  5. [PHP] 使用ftell和fseek函数直接定位文件位置获取部分数据

    对于大文件只获取部分数据很有用 1.使用ftell函数可以获取当前指针的字节位置2.使用fseek函数可以直接定位到指定的位置3.读取指定字节的数据就可以部分获取文件内容了 <?php clas ...

  6. vue—你必须知道的 js数据类型 前端学习 CSS 居中 事件委托和this 让js调试更简单—console AMD && CMD 模式识别课程笔记（一） web攻击 web安全之XSS JSONP && CORS css 定位 react小结

    vue—你必须知道的   目录 更多总结 猛戳这里 属性与方法 语法 计算属性 特殊属性 vue 样式绑定 vue事件处理器 表单控件绑定 父子组件通信 过渡效果 vue经验总结 javascript ...

  7. .net core2.0添加json文件并转化成类注入控制器使用 让js调试更简单—console

    .net core2.0添加json文件并转化成类注入控制器使用 上一篇,我们介绍了如何读取自定义的json文件,数据是读取出来了,只是处理的时候太麻烦,需要一遍一遍写,很枯燥.那么有没有很好的办法呢 ...

  8. js调试--查找dom对象绑定的函数

    点击最右侧的js文件. 选中函数upload_pic_box,右击,选择在控制台中调试,或者在控制台直接输入该函数 点击最后一行代码会打开该函数所在的js文件

  9. 百度地图api将可视区域定位到当前所在位置

    1.前言 开头不说点什么,总是有点不习惯.还是说点什么吧,关于百度地图,我用的次数还是比较多的,没办法,需求呀.好吧,在用百度地图的时候,确实有过很多需求,不过好在百度地图很强大,每次需求在探索后都能 ...

随机推荐

  1. Autofac的注入和web.config配合

    public static void BuildMvcContainer() { var builder = new ContainerBuilder(); var assemblys = AppDo ...

  2. 配置github上的SSH key及上传自己的项目到github

    这篇文章比较好,链接如下:http://www.jianshu.com/p/b81eeb5d7858 需要指出的几点:1.

  3. JavaWeb之 Servlet执行过程 与 生命周期

    Servlet的概念 什么是Servlet呢? Java中有一个叫Servlet的接口,如果一个普通的类实现了这个接口,这个类就是一个Servlet.Servlet下有一个实现类叫HttpServle ...

  4. R 中安装xlsx包缺少java环境解决方案

    1.安装Java程序(官网win7 64位系统的Java安装程序及网址http://www.java.com/zh_CN/download/manual.jsp),选择windows 64位脱机安装到 ...

  5. bzoj 3223/tyvj 1729 文艺平衡树 splay tree

    原题链接:http://www.tyvj.cn/p/1729 这道题以前用c语言写的splay tree水过了.. 现在接触了c++重写一遍... 只涉及区间翻转,由于没有删除操作故不带垃圾回收,具体 ...

  6. android开发系列之代码整洁之道

    说起代码整洁之道,想必大家想到更多的是那本经典重构书籍.没错,记得当时自己读那本书的时候,一边结合项目实战,一边结合书中的讲解,确实学到了很多东西,对我自己的编码风格影响极深.随着时间的流逝,书中很多 ...

  7. .NET Async/Await 最佳实践

    .NET 异步编程Guildlines 名称 描述 例外 Avoid async void Prefer async Task methods over async void methods Even ...

  8. ios中怎么样判断路径最后的后缀名称

    使用hasSuffix属性即可 例如 [photo.thumbnail_pic.lowercaseString hasSuffix:@"gif"]

  9. golang的++与--

    http://godoc.golangtc.com/doc/faq#inc_dec 简单地说, 在golang中++,--操作是语句而不是表达式. 所以a=b++, return x++之类绝对提示错 ...

  10. 修改linux端口范围 ip_local_port_range

    tags: ip_local_port_range 端口范围 sysctl Linux中有限定端口的使用范围,如果我要为我的程序预留某些端口,那么我需要控制这个端口范围, 本文主要描述如何去修改端口范 ...