JS Debug-Navigate to the file location where the function is located

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

In the console, enter the function name you want to find, such as Votepost and then enter:

The source code of the function is bold, and there is a link in the lower right corner blog-common.js?v=we8o1xrgctu07qvvwyqerqd7aa8fdjp_dgoe-crat3k1:1 What does this mean?
Behind the V=WE8O1XRGCTU07QVVWYQERQD7AA8FDJP_DGOE-CRAT3K1 directly ignored this is the version number, which prevents caching.
Blog-common.js:1
Blog-common.js is the JS file where the function resides, and 1 is the line number where the code is located.

Directly Click this link, you can jump to the Sources panel, this is the source panel, debugging the most important feature, will be introduced slowly.

But all the code is in one line, how do we look at it? 4,946 characters, fully indented on one line ...
Chrome provides us with a code formatting feature that can be formatted by clicking on the Pretty Print button below.

After the format is finished is very beautiful code, as to see do not understand, that is another matter.
Some can not understand the code is Uglifyjs,google ' s closure such as the tools compiled, such as jquery.min.js files.
If the format is enough to find the location of the function, do not worry, I am in, panic what? Go back to the console panel just now.

You are delighted to find that blog-common.js?v=we8o1xrgctu07qvvwyqerqd7aa8fdjp_dgoe-crat3k1:91
Line number becomes 91, now click this link, you can jump to the corresponding format after the location, is not super convenient.

Today's content is almost these, in fact, there are very few direct global functions for you to debug, because now jQuery popular, all kinds of click, on the event of binding, resulting in a very cumbersome source location.
Fortunately, I wrote an article, a more detailed analysis of the problem, please refer to the "JQuery Incident source Location Problem"