Ви коли-небудь хотіли переглянути вихідний код веб-сторінки з 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, у рядок URL-адреси, а потім збережіть зміни в закладці, натиснувши «Готово»
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 ви використовуєте.