How does google chrome developer tools access the "text" property of the <script> tag when the content was loaded using the src attribute?

I am debugging some 3rd party app and I would like to dynamically reload/replace some of the content of the tags, however by inspection properties like innerHTML are not set and I can't see anything from the javascript developer console that would suggest a property of method to get the javascript content. The file is dynamic so re-downloading the file it not suitable in this case.

There are some other questions on SO which address this problem with no good answer for me, for example it is suggested to pull the content again using an XMLHttpRequest or some jQuery. However this is not suitable for my purpose.

How can I get the content of the file specified as the 'src' of a <script> tag?

However I can see that google chrome can inspect the loaded source content of the script tag in the developer console, here is a screenshot;

Any idea how it is done? I am happy to use the google chrome devto开发者_如何学Gools, or some platform/browser specific extension as I am just using this for debugging.

I presume it is accessing some local cache of the downloaded src, but I would also expect that cache file or value is inspect-able from google chrome somehow...?

DevTools are deeply integrated into the browser and do that with help of C++ code in WebCore. In your case DevTools just be notified when browser makes a request, receive the response, receive the data etc.

Chrome DevTools AKA Safari Web Inspector has two parts. Backend (~26kloc of C++ code) and Frontend (55kloc of js code).

You can see the API between WebCore and DevTools bakend at InspectorInstrumentation.h.

Also there is an API between Backend part of DevTools and Frontend part of DevTools. It is described in Inspector.json. You can use this API and write your own Frontend or implement an extension which does something with help of DevTools backend.

The docs at the project's documentation page. The latest video about the project at Google IO 2011.

@cwallenpoole tells how to get the js code.. simply open it in browser and if it is minified simply include (copy contents of js file) it in a script tag in html doc, go to chrome dev tools, open the scripts pane and navigate to the copy pasted script source and press the curly brackets at the bottom bar of dev tools and see the magic :)

You can get the source of any JavaScript file by simply going to that URL -- this is one from StackOverflow: http://cdn.sstatic.net/js/stub.js?v=845b73ac2eff

The problem, of course, is that it is minified when viewed that way, which leads to long, annoying headaches, but it is still accessible.