Вы когда-нибудь хотели просмотреть исходный код веб-страницы с iPad или iPhone? К сожалению, мобильный Safari не включает эту функцию сам по себе и еще не имеет встроенного набора инструментов мобильного веб-инспектора, но с помощью пользовательского букмарклета вы можете просматривать исходный код любой веб-страницы прямо в iOS и iPadOS.

В этой статье показано, как настроить просмотр исходного кода в Safari для iPad и iPhone с помощью букмарклета и трюка с javascript.

Как просмотреть исходный код в Safari для iPad и iPhone

1. Откройте Safari, если вы еще этого не сделали
2. Добавьте эту веб-страницу (или любую другую) в закладки с помощью Safari на iPad, iPhone или iPod touch и назовите закладку «Просмотр источника»
3. Нажмите здесь, чтобы просмотреть javascript букмарклета, а затем выберите «Выбрать все» -> Копировать
4. Нажмите значок «Закладка» на экране нового браузера Safari и нажмите «Изменить», затем нажмите на закладку, которую вы сохранили на шаге 2
5. Вставьте код JavaScript, скопированный на шаге 3, в адресную строку, а затем сохраните изменения в закладке, нажав «Готово»
6. Теперь, когда вы хотите просмотреть источник веб-страницы на iPad или iPhone, откройте меню «Закладки» и выберите «Просмотр источника»
7. Исходный код будет отображаться с выделенным синтаксисом и кликабельными исходными URL

Важно отметить, что используемый здесь javascript отправляет исходную страницу, которую вы просматриваете, на сервер michelsen.dk для обработки. Если вас это не устраивает, есть другие решения, но они не выделяют синтаксис и в целом не так элегантны.

Например, вы можете использовать приведенный ниже Javascript в качестве букмарклета для просмотра исходного кода, который не будет обрабатываться через удаленный сервер, но не использует подсветку синтаксиса:

javascript:(function(){var a=window.open('about:blank').document;a.write('Источник '+location. href+'');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))})();

Похожий совет использует отредактированную закладку, позволяющую запускать Firebug с Mobile Safari также на iPhone или iPad, что может быть немного более полезным для некоторых веб-разработчиков.

Этот замечательный совет исходит от Michelsen.dk. Найдено через Twitter, вы можете подписаться на нас и там

Кто знает, может быть, когда-нибудь Safari в iOS и iPadOS получит нативную возможность просмотра исходного кода? До тех пор вам придется полагаться на сторонние приложения или подобные инструменты.

Это работало нормально при тестировании, но некоторые пользователи сообщают о разных результатах в различных более поздних версиях Safari и iOS. Сообщите нам в комментариях ниже, что работает для вас и какую версию iOS и iPad или iPhone вы используете.