So zeigen Sie Webseitenquellen auf dem iPhone/iPad an: 7 Methoden

Angenommen, Sie besuchen eine Website, an der Sie gearbeitet haben, und sehen einige Störungen. Sie müssen den Seitenquelltext auf dem iPhone oder iPad anzeigen, um den fehlerhaften Code zu finden und ihn zu beheben. Sie öffnen Safari und werden verrückt, um die Schaltfläche zum Anzeigen des HTML-Quellcodes in Safari ohne Erfolg zu finden. Was tust du jetzt? Es ist ganz einfach, lesen Sie einfach diesen Artikel!

Jeder Website-Entwickler, Programmierer, Softwaredesigner, Entwickler von App Store-Apps, Ersteller von Inhalten und Webmaster weiß, wie wichtig Quellcode ist. In diesem Arbeitsabschnitt müssen Sie sich immer den Quellcode einer Webseite ansehen, um Probleme zu beheben, zu debuggen, zu gestalten und der Website einen Mehrwert zu verleihen.

Während diese Aufgabe auf Android- und Windows-Geräten ziemlich einfach ist, ist sie auf Apple-Geräten wie iPhone, iPad, MacBook und iMac gleichermaßen schwierig. Unter macOS ist die Funktion jedoch verfügbar, aber ausgeblendet, und Sie können sie finden, indem Sie diesem „

Zeigen Sie den HTML-Quellcode in Safari an“ Artikel. Bei iOS-Geräten ist es jedoch eine andere Geschichte.

Apple hat es absolut schwierig gemacht, Seitenquellen auf dem iPad/iPhone anzuzeigen. Es gibt keine nativen, oder ich sollte sagen, einfachen Methoden, die Sie entweder antippen oder berühren können, um den HTML-Quellcode von Webseiten abzurufen. Aber werde noch nicht zu verrückt. Lesen Sie stattdessen diesen Artikel bis zum Ende, um herauszufinden, wie Sie am besten lernen, wie Sie den Seitenquelltext in Safari auf dem iPhone oder iPad anzeigen.

Gründe, warum Sie den Seitenquelltext auf dem iPhone/iPad anzeigen müssen

Nachfolgend finden Sie einige Situationen und Gründe, um Seitenquellen in Safari auf dem iPad/iPhone anzuzeigen:

Sie müssen die Seitenquelle einer Webseite für ein bestimmtes Gerät wie iPhone oder iPad anzeigen. Wenn Sie auf einem Mac auf die Website zugreifen und den HTML-Quellcode anzeigen, sehen Sie die Elemente für die Desktop-Version, nicht die iPhone- oder iPad-Versionen.
Sie sind auf Reisen und möchten Ihre Zeit in das Betrachten von Webseitencodes investieren, um neue Ideen zu bekommen oder einen Debugging-Plan zu erstellen.
Sie bevorzugen die Website-Entwicklung auf Ihrem iPad, da es viele Multitasking-Funktionen wie z Bühnenmanager, geteilte Ansicht usw.

Befolgen Sie daher die folgenden Methoden, um vorbereitet zu sein, falls die Notwendigkeit auftritt, die Seitenquelle auf dem iPhone oder iPad anzuzeigen.

Beste Methoden zum Anzeigen der Seitenquelle auf dem iPhone/iPad

Im Folgenden sind die gängigen Möglichkeiten zum Anzeigen von Seitenquellen in HTML-Codes auf einem iPhone oder iPad aufgeführt, ohne eine Drittanbieter-App zu nutzen. Diese Methoden sind für datenschutz- und sicherheitsbewusste Programmierer und Endbenutzer geeignet:

1. Holen Sie sich den HTML-Quellcode mit der Shortcuts-App

Diese Methode funktioniert nur, wenn Sie iOS 12.0 (iPadOS 12.0) und höher ausführen. So erstellen Sie auf dem iPhone oder iPad eine Verknüpfung zum Anzeigen einer Seitenquelle:

Öffne das Abkürzungen app vom Startbildschirm oder App Drawer.
Tippen Sie auf die plus (+) Symbol, um eine neue leere Verknüpfung zu erstellen.
Geben Sie in das Suchfeld ein HTML und abholen Erstellen Sie HTML aus Rich-Text.
Suchen Sie erneut nach der Schneller Blick app in das Suchfeld ein und fügen Sie sie dem Shortcut-Editor hinzu.
Tippen Sie nun oben auf das Verknüpfungssymbol und wählen Sie aus Umbenennen.

Verknüpfung zum Anzeigen des Quellcodes auf Webseiten

Benennen Sie es um in Quellcode anzeigen und tippen Sie auf Fertig.
Tippen Sie auf die (ich) Taste und schalten Sie die ein Im Freigabeblatt anzeigen Möglichkeit.
Öffnen Sie nun den Safari-Browser und besuchen Sie eine Webseite Ihrer Wahl.

Zeigen Sie die Quellcode-Verknüpfung auf dem Share-Sheet in Safari an

Berühre das Aktie Schaltfläche in der Safari-App und scrollen Sie nach unten, um die zu finden Quellcode anzeigen Abkürzung.
Tippen Sie auf die Verknüpfung und Sie erhalten den HTML-Quellcode in Quick Look.

2. Anzeigen des Seitenquelltexts mit einem Lesezeichen-Skript

Bei dieser Methode erstellen Sie ein Lesezeichen und die URL ist ein Quellskript zum Anzeigen. Wenn Sie eine beliebige Webseite durchsuchen und die Seitenquelle in Safari anzeigen müssen, tippen Sie einfach auf das Lesezeichen. Sie erhalten einen HTML-Quellcode für die Seite. So wird's gemacht:

Besuchen Sie eine beliebige Website und markieren Sie sie in Ihrem Safari-Browser für iPad oder iPhone.
Tippen Sie auf die Safari-Menü in der oberen linken Ecke und gehen Sie zu Lesezeichen.
Berühren Favoriten um das soeben hinzugefügte Lesezeichen zu finden.
Tippen Sie lange auf das Lesezeichen und wählen Sie es dann aus Bearbeiten im Kontextmenü.

So bearbeiten Sie den Titel und die Adresse eines Lesezeichens

Löschen Sie den vorhandenen Lesezeichentitel und benennen Sie ihn um in HTML-Quellcode oder irgendetwas anderes, nur um sich an das Lesezeichen zu erinnern.
Tippen Sie auf die Adresse Feld und löschen Sie die vorhandene URL.
Kopieren Sie den folgenden Code und fügen Sie ihn als URL ein (Code-Ersteller: Rob Flaherty):

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

Klopfen Erledigt auf der Tastatur, um die bisher vorgenommenen Änderungen zu speichern.
Gehen Sie nun zu der Webseite, für die Sie den Quellcode überprüfen müssen.

So zeigen Sie den Seitenquelltext in Safari mit einem Lesezeichen-Skript an

Gehen Sie zum Lesezeichen Menü und berühren Sie die HTML-Quellcode Lesezeichen, das Sie gerade erstellt haben.
Sie sollten den HTML-Code der Seite, die Sie besuchen, in einem neuen Safari-Tab sehen.

Lesen Sie auch:So verwalten Sie Lesezeichen in Safari auf iOS und Mac

3. Anzeigen der Seitenquelle mit macOS-Tethering

Die Safari-App auf iPhone und iPad verfügt über ein integriertes Web-Inspector-Tool. Leider funktioniert die Funktion nicht direkt auf iPhone- oder iPad-Geräten. Sie müssen die Geräte an ein MacBook oder einen iMac anbinden. Dann können Sie Steuerelemente auf dem Mac Safari verwenden, um den HTML-Quellcode zu visualisieren. Der Prozess läuft in zwei Phasen ab, wie unten beschrieben:

Aktivieren Sie den Web-Inspektor

Befolgen Sie diese Schritte zum Einschalten Webinspektor Funktionalität auf Safari für iPad und iPhone:

Öffnen Sie auf Ihrem iPhone oder iPad die Einstellungen App.
Gehe zu Safari-Einstellungen.
Scrollen Sie zum unteren Rand des Safari-Einstellungsfensters, um die zu finden Fortschrittlich Speisekarte. Tippen Sie darauf.

So erhalten Sie Web Inspector auf Safari iPad

Aktivieren Sie die Webinspektor indem Sie auf die Umschalttaste tippen.

Anzeigen der Seitenquelle auf Mac Safari

Gehen Sie zu Ihrem Mac und befolgen Sie diese Schritte:

Verbinden Sie das iPhone oder iPad über das USB-Kabel mit einem MacBook oder iMac.
Wenn das Gerät nicht zuvor authentifiziert wurde, fordert Mac Sie auf, es mit der Apple-ID zu authentifizieren.
Öffnen Sie nun die Safari-App auf dem Mac und besuchen Sie eine beliebige Website.
Klicken Sie in der Mac-Symbolleiste auf Entwickeln.
Suchen Sie im sich öffnenden Kontextmenü nach Ihrem iPad oder iPhone.
Klicken Sie auf Ihr iPad oder iPhone, um ein neues Fenster auf Ihrem Mac zu öffnen, das den Safari-Bildschirm dieser Geräte anzeigt.
Öffnen Sie nun die Ziel-Website auf Ihrem iPhone oder iPad und sehen Sie sich den Quellcode im Mac-Safari-Browser an.

Wenn Sie mit Apps und Tools von Drittanbietern einverstanden sind, sollten Sie sich auch diese zusätzlichen Methoden zum Anzeigen von HTML-Quellcodes von Webseiten ansehen:

4. Safari-Erweiterung – Web Inspector

Sie können die Web Inspector-Erweiterung für den Apple Safari-Browser auf iPad und iPhone installieren. Rufen Sie dann die Erweiterung auf, wenn Sie eine Webseite durchsuchen, um ihren HTML-Quellcode anzuzeigen. Hier sind die Schritte, die Sie ausprobieren sollten:

Öffne das Einstellungen App und gehen Sie zu Safari-Einstellungen Abschnitt.
Scrollen Sie nach unten, bis Sie die finden Erweiterungen Möglichkeit. Tippen Sie darauf.

Gehen Sie in den Safari-Einstellungen zu Weitere Erweiterungen

Tippen Sie in den Erweiterungen auf Weitere Erweiterungen.
Die App Store-Seite für Safari-Erweiterungen wird angezeigt.
Berühre das Suchen Feld und Typ Webinspektor und tippen Sie auf der Tastatur auf Suchen.
Suchen und installieren Sie die Web Inspector-App.
Gehen Sie wieder zu Einstellungen > Safari > Erweiterungen > und tippen Sie auf Webinspektor.
Verwenden Sie die Umschaltfläche, um diese Erweiterung für Safari zu aktivieren.
Öffnen Sie Safari und besuchen Sie eine beliebige Website.

Aktivieren Sie Web Inspector aus dem Safari-Erweiterungsmenü

Tippen Sie auf die Erweiterungen Symbol in der rechten Ecke der Adressleiste.
Wähle aus Webinspektor Verlängerung.
Wählen Sie das Planen Sie einen Tag ein Option in dem Popup, das angezeigt wird.
Tippen Sie erneut auf Erweiterungen Symbol und berühren Sie dann Web Inspector.
Der HTML-Quellcode sollte unten auf der angezeigten Webseite erscheinen.

Erfahren Sie, wie Sie mit Web Inspector den Seitenquelltext auf dem iPhone oder iPad anzeigen

Sie können zwischen den Registerkarten wie DOM, Elemente, Konsole, Netzwerk und Ressourcen wechseln.
Um zur normalen Ansicht zurückzukehren, tippen Sie einfach auf die Web Inspector-Erweiterung im Abschnitt „Erweiterungen“ von Safari.

5. iOS-App – Quelle anzeigen

Sie erhalten es kostenlos im App Store. Geben Sie im Suchfeld Quelle anzeigen ein und tippen Sie auf Suchen. Sie sehen mehrere Ergebnisse im App Store. Installieren Sie diejenige mit der Aufschrift View Source. Anbieter der App ist Roman Tomjak.

Öffnen Sie die App auf dem Startbildschirm oder im App Drawer. Geben Sie dann die Website-URL in die Adressleiste ein, um den HTML-Quellcode anzuzeigen.

Das Tool bietet eine Ansicht des Quellcodes in iPhone-Größe. Sie können jedoch mit den entsprechenden Schaltflächen in der unteren rechten Ecke des Bildschirms die Ausrichtung ändern oder hineinzoomen.

6. Quellcode kostenlos mit Google Web Cache anzeigen

Sie können den folgenden netten und coolen Trick auf besuchten Websites ausführen, um den zugrunde liegenden Quellcode in Safari oder Chrome anzuzeigen:

Besuchen Sie die Webseite, für die Sie den HTML-Quellcode finden müssen.
Tippen Sie auf die Adresse in der Adressleiste von Safari oder Chrome.

Nehmen Sie den Cursor vor den HTTPS-Code

Nehmen Sie den Schreibcursor am Anfang der Adresse, wie im obigen Bild gezeigt.

Geben Sie nun den folgenden Code vorher ein https://

Zwischenspeicher:

Schlagen Sie die Gehen Taste auf der iOS-Tastatur.

So zeigen Sie Seitenquellen in Safari mit Google Web Cache an

Oben auf der Seite müssen Sie die sehen Quelltext anzeigen Möglichkeit. Tippen Sie darauf.
Jetzt erhalten Sie den Quellcode der Webseite, die Sie gerade besucht haben.

Lesen Sie auch:So importieren Sie Ihre Lesezeichen, Passwörter und mehr

7. Quellcode auf Web-Apps anzeigen

Es gibt viele Websites, auf denen Sie die zugrunde liegenden Quellcodes von Websites und Webseiten kostenlos oder gegen eine geringe Gebühr offenlegen können. Von all diesen Web-Apps habe ich den Quellcode-Viewer von CodeBeautify ausgewählt. So funktioniert das:

Gehen Sie auf dem iPhone oder iPad zu diesem Link: Quellcode-Viewer mit dem Safari-Browser.

So zeigen Sie den Quellcode in Web-Apps an

Im URL eingeben Geben Sie die URL der Webseite ein, für die Sie den HTML-Quellcode anzeigen möchten, oder kopieren Sie sie und fügen Sie sie ein.
Tippen Sie auf die Sicht Schaltfläche, um die Seitenquelle im iPhone/iPad Safari-Browser anzuzeigen.

Abschluss

Jetzt kennen Sie also alle Tricks zum Anzeigen der Seitenquelle auf iPhone- und iPad-Geräten. Sie haben in diesem Artikel einige native und nicht-native Methoden entdeckt. Sie können sich einfach an die nativen Tricks auf dem iPad oder iPhone halten, um den HTML-Quellcode von Webseiten anzuzeigen, oder Apps verwenden, die die Aufgabe erheblich erleichtern.

Lassen Sie mich wissen, welche Methode Ihnen gefallen hat, indem Sie unten einen Kommentar hinterlassen. Teilen Sie den Artikel auch auf Social Media und WhatsApp, um Ihren Freunden zu helfen, die Website-Entwicklung und App-Codierung lernen.

Next Up, So lernen Sie Swift auf Mac und iPad.