View Source On IPhone And IPad

img-0
admin
December 3, 2020 code

If you’re anything like me, and for your sake I hope not, then you might have this problem of needing to check the nuts & bolts of every site you visit.

On Chrome & Safari, this is easy peasy – simply Inspect Element. But what to do when uncovering a juicy little site while on the go?

Now, I’m sure there are a variety of nifty apps that provide Inspect and View Source functionality. But, if you’re looking for a quick & painless way to view source on your iPhone or iPad, here it is.

1. Copy This Bookmarklet JS

Select All, then Copy the following piece of Javascript. It’s a Bookmarklet function care of Ole Michelsen.

javascript: (function() {
  var w = window.open("about:blank"),
    d = w.document;
  d.write(
    "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();
})()

2. Create a View Source Bookmark

Create a bookmark – the page you’re currently on will be fine – and name It View Source.

img-1

4. Boom. You’re done son.

That’s it. Now when pursuing the interwebs on an iPhone or iPad, simply select your View Source bookmark to peep the source.

Note: When you tap the bookmark, the source will silently open up as a new tab. So, you’ll have to open all tabs to select the newly created tab.

Other posts