How to view page source in Safari browser on an iPhone?
I thought there'd be an easy way to do this, but I may have been wrong.
How can I view the source for a web page using Safari browser on an iPhone?
Solution 1:
Apple’s native solution is Safari Web Inspector. Currently all developer tools for iOS do still run on macOS so get out your mac and dive in if you want a first party solution.
Here’s a 5 minute tech talk, but the developer site has hours and pages of content depending on what you are going to do with this.
- https://developer.apple.com/videos/play/tech-talks/401/
To enable on the iPhone - use the setting app, Safari, Advanced
Solution 2:
You don’t need an app to inject a view source share option.
Create a bookmark in mobile Safari and then edit it to include
javascript:(function()%7Bvar a=window.open('about:blank').document;a.write('<!DOCTYPE html><html><head><title>Source: '+location.href+'</title><meta name="viewport" content="width=device-width" /></head><body></body></html>');a.close();var b=a.body.appendChild(a.createElement('pre'));b.style.overflow='auto';b.style.whiteSpace='pre-wrap';b.appendChild(a.createTextNode(document.documentElement.innerHTML))%7D)();
When you are on a page and select this “bookmark” it transforms the page and opens up a new tab with most (anything inside <head> or <body>) of the source code from the current web page.
Solution 3:
Mobile Safari can call other programs to "View Source" via the share functionality in iOS / iPadOS.
To transform your web page into source, install an app that has this functionality (e.g. View Source - HTML, JavaScript and CSS), click the share button in the middle of screen footer (the icon depicts an arrow out from a square). This will open new overlay window where one can find:
And for current webpage one can see:
Solution 4:
With iOS14 and above you can make shortcut using these actions : 