Take the 2-minute tour ×
Android Enthusiasts Stack Exchange is a question and answer site for enthusiasts and power users of the Android operating system. It's 100% free, no registration required.

Is there a way to view the source HTML in the Android web browser?

share|improve this question

migrated from stackoverflow.com Jan 21 '11 at 22:36

This question came from our site for professional and enthusiast programmers.

11 Answers 11

up vote 38 down vote accepted

You can use Javascript's alert method to return the source code, type this in the address bar:

javascript: alert(document.getElementsByTagName('html')[0].innerHTML);

share|improve this answer
1  
initially, I had doubt that javascript: URI scheme would work on Android's browser, but it seemed to work on my 2.1 browser. However, you don't get syntax highlighting and you cannot copy the text, so it's not very usable for long HTML pages. –  Lie Ryan Jan 22 '11 at 1:45
    
You don't get syntax highlighting from Internet Explorer either, since it just opens up Notepad. –  Al E. Jan 22 '11 at 7:16
    
It works great. Thank you very much! –  Vijay Jan 25 '11 at 18:11
    
@Al not relevant to this question, but IE8 does have syntax highlighting and line numbering in its built-in View Source viewer now (at least on Vista and Win 7 which are the only machines I have handy). Noticed this a while ago as a pleasant surprise. –  GAThrawn Feb 7 '11 at 16:34
    
Doesn't work for me! The emulator always adds the http:// prefix and I get a site not found by Google. –  user2771 Feb 7 '11 at 17:13

In Firefox or Chrome on Android it's possible to view source by prefixing the URL in the address bar with "view-source:", i.e. "view-source:http://google.com".

share|improve this answer
2  
Great solution. It even generates syntax coloring (at least on Chrome) and allows to copy source code to the clipboard. –  Jpsy Oct 15 '13 at 7:50
1  
For Firefox for Android there is an add-on which lets you view source code without prefixing URLs each time, just click the "View Source" entry from the app menu and you'll see source code for currently open webpage. The add-on is View Source Mobile –  Francisco Alvarado Dec 23 '13 at 6:40

Look for an app called View Web Source in the market and install it.

Then when browsing, open your menu and tap "share", in the list that pops up choose View Web Source.

share|improve this answer
    
Keith - you ROCK man.. saved my @ss.. couldnt figure out why my video wasnt embedding, but with the help of that tool, i could see by the source that the code wasn't being included by the .net server –  user2645 Feb 2 '11 at 0:55
2  
Link to app: market.android.com/details?id=com.jamesob.vwsource just tried it out, looks good. No syntax highlighting, but does the job. Puts the source into a normal text box which does mean you can easily copy text out of it. –  GAThrawn Feb 7 '11 at 16:43

Another tool that is useful for viewing source AND modifying them live, in Firebug/Web Inspector-like manner, is the weinre remote debugger.

share|improve this answer
    
this answer rocks. –  IAmDeveloper Aug 6 '12 at 15:38

The app mentioned in this answer hasn't been updated since 2009.

You might want to try VT View Source.

share|improve this answer
    
This has syntax highlighting and is very easy to use. Works with the default Android browser and Chrome. Latest Firefox for Android has it's own View Source, so it does not need this. –  Ezward Dec 20 at 20:24

IN chrome, there is remote debugging facility. If you install Chrone on your phone. If you connect your phone through usb to PC,you can view the Javascript modified source on your PC in a Chrome browser.

See the end of http://eclipsesource.com/blogs/2012/08/14/debugging-javascript-on-android-and-ios/

share|improve this answer

you can capture the source to your shell or to a text file if you're using an emulator, which is very handy for development. To do this you'll need to install Android Developer Tools, which comes with adb. Fire up your emulator then from your OS's shell run the command:

adb logcat browser:V *:S

This will output anything from the browser app on your emulator and suppress any other log messages. From there any javascript console.log commands will be captured by adb and output for you to view. So, if you're using JQuery, you can add this to your page and it'll output the whole page html to the log:

$(document).ready(function(){console.log($('html').html())});

This will output everything within your html tag on the page to the log.

You can capture the output of your log (using BASH, at least, I can't speak to other shells) with:

adb logcat browser:V *:S > log.txt

now, any output from the log gets dumped into your log.txt file. This is really handy for a whole page's worth of HTML, as you can then search through it as you would any other text doc.

If you want to grab a specific bit of the page rather than the whole thing, you can specify that part of the page rather than the html tag in your JQuery, so if you need to look at a single div that has a class/id associated with it (for this example, it has a class named 'inspect-me'), you can change your JQuery to:

$(document).ready(function(){console.log($('div.inspect-me').html())});
share|improve this answer
    
While this may work fine, the question said in the Android web browser -- not from. Getting the source using a PC has much easier ways -- as e.g. pressing Ctrl-U in Firefox ;) –  Izzy Aug 25 '12 at 17:15

If this is for debugging (from your comment it looks like it is) something even better is installing a user agent switcher extension for Firefox or Chrome on your desktop. Change the user agent to Android and you get the mobile version of the site, but with all the source and debugging tools you're used to.

share|improve this answer

If you are using a Opera browser type this in your address bar, make sure you erase the http and other stuff, then type:

server:source

in the address of the page which you opened.

share|improve this answer

Create a new bookmark (bookmarklet) on Mobile Chrome with:

Name: View Source (vs)

URL: javascript:document.location='view-source:'+document.location; void(0);

Now when on a page, tap the address field and start typing: vs. The bookmarklet should appear, click it and you are ready.

share|improve this answer

If you want to view source of Android browser page, or inspect page you can use this https://developer.chrome.com/devtools/docs/remote-debugging Its very good inspector

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.