Как нажать f12 в браузере андроид

Обновлено: 02.07.2024

Можете ли вы представить себе создание и отладку кода веб-сайта без помощи каких-либо интегрированных инструментов разработки и отладки? Тем из нас, кто занимается разработкой сайтов и веб-приложений более нескольких лет, нам не нужно думать, что это реальность, с которой мы сталкиваемся на регулярной основе.

Но времена изменились. Тяжелые требования и ответственность, предъявляемые к веб-разработчикам сегодня, обусловили необходимость разработки инструментов для разработчиков во всех современных браузерах.

Выпустив бета-версию IE9 и встроенные средства разработчика F12 , команда IE взяла на себя обязательство помогать разработчикам быстро отлаживать свой интерфейсный код и повышать производительность сайта.

В этой статье я расскажу вам о некоторых наиболее важных функциях IE9 F12 Developer Tools с особым акцентом на том, что нового и что наиболее практично:

Вкладка «Сеть», новая для IE9, позволяет отслеживать и оптимизировать производительность сайта.

Чтобы просмотреть сетевые ресурсы (как показано выше в SitePoint ), нажмите F12, чтобы открыть Инструменты разработчика (в качестве альтернативы вы можете выбрать опцию «Инструменты разработчика F12» в меню «Инструменты» IE9); затем нажмите вкладку Сеть.

Для повышения производительности вкладка «Сеть» по умолчанию не сразу начинает захват ресурсов. Чтобы начать просмотр ресурсов, загружаемых на текущую страницу, нажмите кнопку « Начать захват» , а затем обновите страницу. Ресурсы будут продолжать отображаться только на текущей вкладке и остановятся, когда вы нажмете кнопку « Остановить захват» или закроете вкладку.

На приведенном выше снимке экрана показана сводка загружаемых ресурсов. Он включает информацию о запрошенных URL-адресах, файлах, загружаемых с помощью HTML или CSS, запросах на основе Ajax и ресурсах, загружаемых динамически с помощью JavaScript (например, если атрибут src элемента изображения изменяется).

Данные, отображаемые в детальном представлении, можно экспортировать в формате CSV или XML. Эта опция доступна с помощью значка Сохранить , который открывает диалоговое окно сохранения, показанное ниже:

Чтобы протестировать новую вкладку «Сеть» в бета-версии IE9, вы можете посетить демонстрацию «Мониторинг сети» на сайте тестового диска IE9 или узнать больше о функции вкладки «Сеть» в IEDNlog MSDN.

Проверка HTML и CSS

Элементы и стили DOM также легко найти, открыв Инструменты разработчика F12 и щелкнув по значку Выбрать элемент .

Эта опция (которая также доступна в меню « Найти» или нажатием Ctrl-B) дает вам возможность выбрать любой элемент и вызвать связанные с ним HTML и CSS. Вот пример, показывающий логотип SitePoint с эквивалентным HTML-кодом, отображаемым в структуре дерева-узла:

После выбора параметра « Выбрать элемент по клику» любой элемент на веб-странице, на который вы наведете курсор, получит синюю рамку (как показано на логотипе SitePoint выше). Это позволяет вам конкретно выбирать, какую область страницы вы хотите исследовать.

Панель DOM позволяет редактировать HTML на лету и сразу же видеть изменения в окне. Для этого просто нажмите значок « Редактировать» и отредактируйте HTML-код, как в обычном текстовом редакторе. Когда вы закончите редактирование, нажмите кнопку Edit , и изменения будут видны в окне просмотра.

Рядом с деревом DOM вы увидите все стили CSS, связанные с выбранным элементом, как показано ниже:

Инструменты разработчика IE9 F12 позволяют на лету изменять стили для тестирования и отладки выбранного CSS.

Вернувшись в основную панель (слева от инструментов), вы можете переключиться с вкладки HTML на вкладку CSS . На вкладке CSS перечислены все свойства и значения, найденные в выбранной таблице стилей, и они полностью доступны для редактирования, и изменения вступают в силу немедленно. Вкладка CSS также имеет селектор таблиц стилей, который позволяет переключаться между таблицами стилей. Это может пригодиться на больших сайтах, которые используют несколько файлов CSS.

Отладка скриптов и использование консоли

Как и ожидается с любыми хорошими инструментами разработчика, IE9 предоставляет мощные возможности отладки скриптов на стороне клиента, которые помогают разработчикам решать проблемы, которые могут возникнуть при работе со сложным кодом. Чтобы начать отладку сценариев на своей странице, откройте Инструменты разработчика F12 и выберите вкладку « Сценарий ».

Отсюда доступно несколько вариантов. Выпадающий список позволяет вам выбрать конкретный скрипт для работы, как показано на скриншоте ниже:

Любые ошибки скрипта, присутствующие на странице (как в примере выше), будут автоматически отображаться в консоли.

В процессе отладки вы можете установить точки останова (с дополнительными условиями), контролировать выполнение скрипта или проверять переменные и стек вызовов.

Когда выбран параметр « Консоль» , вы можете выполнять операторы на лету, вводя их в командную строку консоли. Функция консоли является новой в IE9 F12 Developer Tools и предоставляет ряд бесценных функций для разработчиков.

Любая допустимая строка кода может быть запущена внутри приостановленного сценария (нажав Enter или нажав кнопку Run script рядом с командной строкой консоли), как показано ниже:

При необходимости вы можете изменить командную строку консоли на многострочный, что позволит вам вставлять более сложные команды и сценарии для целей отладки. Естественно, что в многострочном режиме нажатие клавиши Enter на клавиатуре не приведет к выполнению сценария; вместо этого он переместит курсор на новую строку. Чтобы выполнить набранный код в этом режиме, щелкните значок « Выполнить сценарий» .

Командная строка в консоли также позволяет регистрировать ошибки и другую информацию, чтобы помочь в отладке ваших сценариев.

Улучшение производительности скрипта

Отладка ваших сценариев — это только один аспект цикла разработки. В дополнение к уже отлаженным функциям отладки, F12 Developer Tools позволяют тестировать скрипты на производительность с помощью вкладки Profiler .

Функция профилирования сценариев предоставляет данные о времени, которое ваши сценарии тратят на пользовательские методы и встроенные функции сценариев. Кнопка на вкладке « Профилировщик » позволяет запускать и останавливать процесс профилирования, чтобы вы могли контролировать собранные данные.

На приведенном ниже снимке экрана показаны частичные результаты выполнения профиля на домашней странице SitePoint:

Данные можно просматривать либо в представлении функций, либо в виде дерева вызовов , а полученные данные можно сортировать и переупорядочивать, щелкая заголовки столбцов или удаляя заголовки.

Каждый раз, когда вы запускаете и останавливаете профилировщик, записывается другой сеанс профилирования. Все ваши сеансы профилирования доступны в раскрывающемся списке Отчеты и доступны для поиска, как показано на рисунке ниже:

Функция поиска добавляет желтую подсветку к условиям поиска, найденным в выбранном отчете, что упрощает поиск результатов поиска в контексте отчета. Это также дает вам возможность перейти к следующему результату поиска, используя предыдущую и следующую кнопки. Это может пригодиться при попытке отследить конкретные имена методов в длинном отчете.

Наконец, любые полученные данные профиля можно легко экспортировать в формате CSV, щелкнув значок « Экспорт данных» . Это вызовет диалог сохранения, с помощью которого вы можете хранить свои данные локально.

Это всего лишь пример возможностей улучшения и отладки скриптов, доступных разработчикам, использующим IE9 и его интегрированные инструменты разработчика F12. Благодаря буму в веб-приложениях производительность веб-сайта стала еще более важной; Инструменты IE сделали большие шаги, чтобы помочь разработчикам в этой важной области развития.

Функция, недавно добавленная в IE9 F12 Developer Tools, — это возможность изменять строку User Agent (UA), которая читается веб-сервером через заголовки запросов. Хотя это не заставит IE9 имитировать рендеринг другого браузера, он может позволить вам запускать функции и контент, предназначенные для других веб-браузеров (например, предупреждение или другое уведомление для пользователя с более старым браузером или версией браузера). ).

Однако различные режимы рендеринга для предыдущих версий Internet Explorer доступны с использованием улучшенных параметров « Режим браузера» и «Режим документа» . Эти параметры доступны в любое время, когда открыты Инструменты разработчика F12, как показано ниже:

Каждый режим создает раскрывающийся список параметров для изменения способа отображения страницы. Хотя эти параметры точно не имитируют исходные среды визуализации, они предоставляют довольно точный и простой в использовании метод тестирования в различных режимах:

Режим браузера — IE7, IE8, IE9 и IE9 в представлении совместимости IE7
Режим документа — режим причуда, стандарты IE7, стандарты IE8 и стандарты IE9

Быстрое тестирование для различных версий и режимов Internet Explorer никогда не было проще, так как разработчики могут получить прямую выгоду. Для получения дополнительной информации о браузере IE и режимах документа, проверьте эти блоги:

В наши дни сайты и веб-приложения создаются с помощью сложных сценариев. Они требуют большего внимания к производительности и требуют более быстрых средств отладки. В этом свете инструменты разработчика IE9 F12 значительно улучшены. По мере того, как мы приближаемся к запуску IE9 в 2011 году ( Platform Preview сейчас в версии 7), и по мере увеличения доли IE9 на рынке эти и другие инструменты, объединяющие поддержку веб-стандартов и оптимизированного кода, станут бесценными для веб-разработчиков.

Испытайте новые инструменты разработчика IE9 F12 для тестирования, чтобы выяснить, могут ли новые и улучшенные функции помочь вашей разработке для современного браузера. Полное руководство можно найти в MSDN Developer Tools .

Почему бы не принять участие в нашей короткой викторине и посмотреть, сколько вы выбрали из этой статьи.

примечание: SitePoint Content Partner

Это руководство стало возможным благодаря поддержке Microsoft. В сотрудничестве с Microsoft и независимо написанные SitePoint, мы стремимся работать вместе, чтобы разработать контент, который будет наиболее полезным и актуальным для вас — наших читателей.

Вам нужно найти конкретное слово при просмотре длинной страницы или документа? Задачу легко выполнить на вашем компьютере, нажав ctrl + f или же команда + f. Используя эти сочетания клавиш, вы можете найти слова, которые ищете.

Вас не раздражает отсутствие возможности использовать ctrl + f на устройстве Andriod? Есть способы, которыми вы можете использовать ctrl + f на своих устройствах Andriod! Да, я знаю, что на вашей QWERTY-клавиатуре нет клавиши управления. Нет, это не кликбейт.

Есть способы, с помощью которых вы можете находить слова в браузере Android и приложениях. Вот все способы, которыми вы можете использовать действие поиска на вашем устройстве Andriod.

Связанный: Как освободить внутреннее хранилище на Android, включая «другое» хранилище

Найти в браузере

При чтении чего-либо в браузере вы можете найти термин или ключевое слово без прокрутки. Наиболее часто используемые браузеры позволяют находить ключевые слова.

В Chrome

Если вы используете браузер Chrome на своем телефоне, вы можете легко находить текст на странице.

Все, что вам нужно сделать, это нажать на многоточие в правом верхнем углу.

В раскрывающемся меню нажмите «Найти на странице».

Введите ключевое слово, которое вы ищете на странице.

Ключевые слова будут выделены желтым, что упростит их поиск. Вам также будет показано, сколько раз ключевое слово присутствует на странице.

Используя стрелки навигации, вы можете перейти к следующему или предыдущему месту, где было использовано ключевое слово. При переходе к любому ключевому слову цвет выделения изменится с желтого на оранжевый.

Связанный: Как скопировать изображение в буфер обмена на Android

В Mozilla Firefox

Если вы используете Mozilla Firefox в качестве браузера на своем устройстве Andriod, вы можете выполнять поиск по странице аналогичным образом.

Панель инструментов приложения по умолчанию находится внизу экрана. Вы можете изменить это в настройках, чтобы вывести панель инструментов в верхнюю часть экрана.

В правом углу панели инструментов вы увидите вертикальное многоточие, на которое нужно нажать.

Появится меню, в котором вы увидите опцию «Найти на странице».

Нажмите «Найти на странице».

Введите ключевое слово, которое вы ищете.

В отличие от Chrome, все ключевые слова на странице не будут выделены. Используя стрелки навигации, вы можете просматривать предыдущие и следующие ключевые слова. Когда вы переходите к каждому ключевому слову, они выделяются черным цветом, а цвет текста меняется на зеленый.

В опере

Если вы используете Opera в качестве браузера на устройстве Android, поиск ключевого слова на странице очень похож на поиск в Chrome и Mozilla.

Снова в правом верхнем углу вы найдете вертикальное многоточие.

Щелкните по ним, чтобы открыть раскрывающееся меню.

Щелкните «Найти на странице».

Введите ключевое слово.

Как и в Chrome, все ключевые слова на странице выделены желтым. Когда вы переходите к каждому слову с помощью стрелок навигации, цвет выделения меняется на оранжевый.

В любом другом браузере

Все браузеры позволят вам найти ключевое слово на любой странице. Если вы используете такие браузеры, как Microsoft Edge или Safari, вы все равно можете использовать эту функцию.

В зависимости от приложения, которое вы используете, кнопки меню будут разными. Вы можете найти горизонтальное многоточие или кнопку меню гамбургера вместо вертикального многоточия.

После нажатия на меню вы должны увидеть «Найти на странице» или «Найти на странице».

Поиск по ключевому слову с помощью окна поиска выделит слова в тексте. Формат выделения может отличаться, и в некоторых браузерах стрелки навигации могут отсутствовать.

Таким образом, даже без ctrl + f на устройстве Android вы можете находить слова, которые ищете, в своем браузере.

Найти в приложении для Android

Помимо возможности находить слова в тексте в браузерах, вы также можете находить ключевые слова в файлах и чатах на Andriod. Вот как вы можете искать по ключевым словам в различных приложениях.

При чтении или написании документа на устройстве Andriod вы можете найти ключевое слово, которое ищете.

Гугл документы

Если вы используете Google docs для просмотра или редактирования любого документа, процесс поиска ключевого слова прост.

При просмотре документа вам нужно коснуться вертикального многоточия в правом верхнем углу экрана.
В меню нажмите «Найти и заменить».

Введите ключевое слово, которое вы хотите найти, и все ключевые слова будут выделены. Используя стрелки навигации, вы можете перейти к предыдущей или следующей.

При написании документа процесс поиска ключевого слова такой же. Единственное отличие состоит в том, что во время письма вы увидите больше опций в меню, чем при просмотре документа.

Связанный: Как найти пароль от Wi-Fi на Android

Microsoft Word

Как и в случае с документами Google, Microsoft Word также позволяет находить ключевые слова в тексте.

Когда вы просматриваете документ с помощью приложения, вы можете увидеть значок поиска на панели инструментов в верхней части экрана.

Коснитесь значка поиска и введите ключевое слово. Это выделит все ключевые слова в документе.

Если вы пишете, то процесс использования функции поиска немного отличается.

Вы должны щелкнуть меню на панели инструментов внизу. В меню вы увидите опцию «Найти». После нажатия на нее вы можете выполнить поиск по ключевому слову.

Стрелки навигации переместят вас к предыдущему или следующему выделенному слову.

Как и в случае с документами, на устройстве Android вы можете использовать функцию поиска по файлам PDF.

Adobe acrobat reader (PDF)

В Adobe Acrobat Reader кнопку поиска легко найти на панели инструментов.

Коснитесь значка поиска, введите ключевое слово и коснитесь кнопки ввода / поиска на клавиатуре.

При поиске в PDF-файле с помощью Adobe вам необходимо использовать стрелки навигации для поиска ключевых слов по отдельности. Все ключевые слова не выделяются вместе. Вам также не будет показано, сколько раз слово присутствует в файле.

Программа просмотра PDF-файлов Google

Как и в случае с Adobe, значок «Найти» присутствует на панели инструментов в средстве просмотра PDF-файлов Google.

В отличие от Adobe, при поиске ключевого слова здесь все вхождения выделяются желтым цветом. Используя навигацию, вы можете переходить от одного ключевого слова к другому. Цвет выделения выбранного ключевого слова изменится на оранжевый.

При работе с файлом Excel или просмотре его на устройстве Andriod вы можете использовать функцию «Найти».

Таблицы Google

При поиске любого слова или значения на листе Google вы можете использовать функцию поиска.

Нажмите на вертикальное многоточие в правом верхнем углу экрана, чтобы открыть меню.

Нажмите «Найти и заменить».

Введите слово или значение, которое хотите найти.

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

Майкрософт Эксель

Параметр «Найти» в Microsoft Excel размещен прямо на панели инструментов.

Коснитесь значка поиска на панели инструментов, а затем введите значение или слово, которое хотите найти.

Вы попадете в ячейку, в которой находится слово. Стрелки навигации могут помочь вам перейти к следующей или предыдущей ячейке.

Для поиска в чате WhatsApp вам нужно щелкнуть вертикальное многоточие в правом верхнем углу экрана.

Нажмите на Поиск.

И чат, и ключевое слово будут выделены. Используя стрелки навигации, вы можете перемещаться вверх и вниз по цепочке.

Хотите найти слово, но не знаете, какой чат проверить?

Вы можете проверить несколько чатов, чтобы узнать, где вы использовали ключевое слово в Whatsapp.

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

Вы получите список всех контактов и групповых чатов, в которых использовалось это слово.

Телеграмма

Как и WhatsApp, Telegram также позволяет пользователям находить ключевые слова из чатов.

В индивидуальных чатах вам нужно сначала нажать на вертикальное многоточие.

Затем нажмите на Поиск.

Для поиска в нескольких чатах коснитесь значка поиска на главном экране и введите ключевое слово, которое хотите найти.

Skype

При использовании приложения Skype на телефоне вы найдете значок поиска в верхней части экрана.

При поиске любого слова на главном экране Skype вам будут показаны контакты, пользователи Skype и чаты, в которых присутствует ключевое слово.

Если вы хотите найти слово в какой-либо конкретной ветке чата, вам нужно открыть ветку.

Нажмите на имя контакта.

Нажмите «Искать в разговоре».

Вы попадете к выделенному ключевому слову. Кроме того, рядом с навигацией вам будет показано, сколько раз слово присутствует в цепочке.

Мессенджер Facebook

Приложение Facebook Messenger имеет панель поиска на главном экране приложения.

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

Чтобы выполнить поиск по ключевому слову в чате, вам нужно сначала открыть ветку.

Нажмите на имя контакта, чтобы открыть страницу меню.

Нажмите в меню на «Искать в разговоре».

Ищете ключевое слово в длинной новостной статье?

Если вы используете приложение Google News на своем устройстве Android, возможно, у вас не получится выполнить прямой поиск по ключевому слову в приложении, но есть способ сделать это.

Вам нужно просто открыть страницу новостей в веб-браузере своего телефона.

Для этого сначала откройте новостную статью, которую хотите прочитать.

Нажмите на вертикальное многоточие внизу экрана.

Выберите «Просмотреть исходную веб-страницу».

Это откроет веб-сайт в вашем браузере. Теперь, в зависимости от того, какой браузер вы используете, вы можете искать по ключевому слову.

Найдите в реальном мире с помощью устройства Android

Вооружившись своим устройством Android, вы можете нажимать ctrl + F для текста в реальном мире.

Хотите найти ингредиент на обратной стороне упаковки по крошечным принтам? Хотите узнать, сколько раз слово повторяется на странице?

Это приложение поможет вам.

Итак, на вашем устройстве Android вы можете находить ключевые слова на веб-страницах и в приложениях. Вы даже можете использовать приложение для поиска ключевых слов из реального мира.

У вас проблемы с поиском ключевых слов в любом приложении для Android? Пропустили ли мы какие-либо приложения, в которых вы можете использовать функцию ctrl + f? Дайте нам знать об этом в комментариях.

Клавиатуры на разных Android смартфонах могут заметно отличаться друг от друга. К тому же, в Google Play присутствует масса альтернативных клавиатур от сторонних разработчиков. Тем не менее, основные приемы ввода и редактирования текста совпадают на подавляющем большинстве Android устройств.

В качестве примера рассмотрим классическую Android клавиатуру от компании Google. На устройствах серии Nexus она установлена изначально, владельцы остальных смартфонов могут без труда скачать ее из официального магазина приложений Google Play. Ссылка на клавиатуру расположена чуть ниже.

Сам процесс ввода текста мало чем отличается от печати на клавиатуре ПК или ноутбука.

Сменить язык ввода можно с помощью кнопки со значком глобуса .

Для того, чтобы ввести заглавную букву, необходимо нажать на клавишу Shift . Удерживая ее и продолжая печать можно ввести несколько заглавных букв подряд. Двойное нажатие по клавише Shift переведет клавиатуру в режим Caps Lock, во время которого все набранные буквы будут заглавными.

Если нужно стереть неверно введенное слово – воспользуйтесь клавишей удаления текста . При одиночном нажатии на клавишу будет удален один символ, находящийся слева от курсора. Удерживая клавишу удаления можно быстро удалить одно или несколько слов. Будьте внимательны – чем дольше вы удерживаете клавишу, тем больше возрастает скорость с которой стирается текст.

В случае, когда требуется переместить курсор в другое место, просто дотроньтесь пальцем до нужного места экрана. Иногда на клавиатурах также присутствуют специальные стрелки, позволяющие перемещать курсор в пределах активного текстового поля.

Кроме основного экрана каждая клавиатура имеет как минимум парочку дополнительных, со служебными символами, цифрами и графическими смайликами. Клавиша переключения экранов обычно находится в нижнем углу клавиатуры.

В клавиатуре Google экран с дополнительными символами открывается с помощью кнопки в левом нижнем углу экрана, а список смайликов – с помощью долго тапа по клавише Enter .

В последнее время большинство клавиатур обзавелись поддержкой безотрывного ввода текста, больше известного как «Swype». При использовании этого метода ввода все слово набирается на клавиатуре одним движением, без отрыва пальца от экрана. Такой способ позволяет существенно сократить время печати.

Тем не менее, в некоторых ситуациях текст проще скопировать и вставить, чем вводить его вручную. Для выделения текста достаточно сделать долгий тап по нужному вам слову. Для того, чтобы изменить границы выделения, нужно потянуть за маркеры по его краям. Кнопки «Вырезать», «Копировать» и «Вставить» появятся в верхней части экрана либо прямо около курсора.

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

Сам процесс ввода текста мало чем отличается от печати на клавиатуре ПК или ноутбука.

Сменить язык ввода можно с помощью кнопки со значком глобуса .

Читайте также: