View source on the iPad and iPhone
Update 2017-07-06: As of iOS 9 this bookmarklet doesn't work reliably anymore. Any suggestions to fix it are most welcome.
As a web developer I'm frequently looking at the source code of various websites. Lately my new iPad has become my primary tool for surfing and reading documentation, but alas it completely lacks a view source feature.
- The code is syntax highlighted (using GeSHi)
- Links are clickable, so you can follow scripts etc.
- Text is fully selectable
The following bookmarklet code basically posts the entire DOM to my server, which then takes care of business server-side:
Loading Source'); d.close(); var f = d.createElement('form'); f.setAttribute('method','post'); f.setAttribute('action','https://ole.michelsen.dk/viewsource/?uri='+encodeURIComponent(location.href)); var i = d.createElement('input'); i.setAttribute('type','hidden'); i.setAttribute('name','DOM'); i.setAttribute('value',encodeURIComponent(document.documentElement.innerHTML)); d.body.appendChild(f).appendChild(i); f.submit(); })();
How to install it
To add it on your computer and sync it to your iPad, just drag this link to your bookmarks:
View Source (click to try it out)
To add it directly from your iPad (or iPhone), you need to create the bookmark manually:
- Add this page as a bookmark
- Then click here to see the bookmarklet code and Select All → Copy
- Now edit that same bookmark, paste the code you just copied into the URL and name it something like "View Source"