原文：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. WPF学习03：Element Binding

    元素绑定是数据绑定的一个子集,关于数据绑定是什么,园子里有很多文章都说得非常好,在此不予详细说明. WPF实现了完善的数据绑定机制,使得元素绑定有简易的实现步骤. 本文的元素指的是WPF中的可视控件. ...

  2. hdu 5224 Tom and paper

    题目连接 http://acm.hdu.edu.cn/showproblem.php?pid=5224 Tom and paper Description There is a piece of pa ...

  3. hdu 1908 Double Queue

    题目连接 http://acm.hdu.edu.cn/showproblem.php?pid=1908 Double Queue Description The new founded Balkan ...

  4. Go语言中如何写Get和Set方法

    首先我们要知道,在Go中方法名首字母大写是要导出的方法(也就是公有方法,public),而小写则是不导出的方法(私有的,private). Go官方不提供对Get.Set方法的自动支持.对是否设置Ge ...

  5. iOS 各种系统文件目录 临时，缓存，document,lib,归档，序列化

    /** 1:Documents:应用中用户数据可以放在这里,iTunes备份和恢复的时候会包括此目录 2:tmp:存放临时文件,iTunes不会备份和恢复此目录,此目录下文件可能会在应用退出后删除 3 ...

  6. apache maven

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAj0AAAGXCAYAAABY/uEUAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjw ...

  7. PHP URL 重定向 的三种方法（转载)

    为了方便查询,转载一篇. 1.使用header()函数    PHP的HTTP相关函数种提供了一个 header()函数,首先要清楚,header()函数必须放在php程序的开头部分,而且之前不能有另 ...

  8. 格式化输出[parts/iomanip]

    /* 用ios类中的成员函数来进行IO格式的控制总需要写一条单独的语句,而不能直接嵌入到IO语句中,显得很不方便,因此C++又提供了一种用操作符来控制IO的格式.操作符分为带参和不带参两种,带参的定义 ...

  9. Java多线程时内存模型

    1. 概述 多任务和高并发是衡量一台计算机处理器的能力重要指标之一.一般衡量一个服务器性能的高低好坏,使用每秒事务处理数(Transactions Per Second,TPS)这个指标比较能说明问题 ...

  10. 《Soft Skill》一书中的好句子

    The biggest mistake that you can make is to believe that you are working for somebody else. Job secu ...