Что нужно знать
-
В Safari: щелкните правой кнопкой мыши веб-страницу и выберите Проверить элемент.
- В Chrome вы можете щелкнуть правой кнопкой мыши и выбрать Проверить.
- Чтобы включить эту функцию в Safari: Safari > Настройки > Дополнительно > проверьте Показать меню «Разработка» в строке меню box.
В этой статье рассказывается, как проверить элемент веб-сайта на Mac. В нем показано, как это сделать через Safari и Google Chrome.
Как использовать функцию проверки элементов на Mac?
Перед проверкой элементов на Mac при использовании Safari необходимо включить меню разработчика в браузере. Вот посмотрите, как его включить и что делать, чтобы проверить элемент.
Если между закладками и окном отображается пункт «Разработка», это означает, что меню разработчика уже включено, и вы можете перейти к шагу 4.
Использование функции проверки элементов в Safari
Вот как использовать Inspect Element в Safari, браузере по умолчанию на компьютерах Mac.
-
В Safari нажмите Safari > Настройки.
Image -
Нажмите Дополнительно.
Image -
Нажмите Показать меню разработки в строке меню, затем закройте окно.
Image - При просмотре веб-сайта щелкните правой кнопкой мыши элемент, который хотите проверить.
-
Нажмите Проверить элемент.
Image -
Теперь вы можете просмотреть код проверенного веб-сайта.
Image
Использование функции проверки элементов в Chrome на Mac
Если вы используете Chrome вместо Safari на своем Mac, просматривать элемент будет еще проще, так как нет необходимости включать эту функцию. Вот что делать.
- В Chrome перейдите на веб-сайт.
- Щелкните правой кнопкой мыши на элементе, который хотите проверить.
-
Нажмите Проверить.
Image -
Теперь вы можете просмотреть код в боковом окне Chrome.
Image
Почему я не могу проверить на своем Mac?
Возможно, вы не сможете проверить элемент на своем Mac, если не включили меню «Разработчик» в Safari. Вот напоминание о том, как это сделать.
-
В Safari нажмите Safari > Настройки.
Image -
Нажмите Дополнительно.
Image -
Нажмите Показать меню разработки в строке меню, затем закройте окно.
Image
Как внести изменения на сайт, проверив элемент
Помимо того, что вы можете просматривать код на веб-сайте, вы также можете временно изменить любой элемент веб-сайта с помощью Inspect Element. Вот как это сделать через Safari.
Процесс очень похож на другие браузеры.
- При просмотре веб-сайта щелкните правой кнопкой мыши элемент, который хотите проверить.
- Нажмите Проверить элемент.
- Дважды щелкните текст в коде, чтобы сделать его редактируемым.
- Удалите его или введите новую строку текста.
- Нажмите Enter.
- Код был временно изменен только для вашего удобства.
Зачем использовать функцию проверки элемента?
Возможность проверки элемента полезна по многим причинам.
- Чтобы изменить код на лету. Дизайнеры веб-сайтов могут временно изменять элементы на веб-сайте, чтобы увидеть, как эти изменения повлияют на вещи.
- Чтобы проверить код. И дизайнеры, и специалисты по маркетингу могут проверить код, чтобы убедиться, что там есть такие вещи, как данные Google Analytics.
- Для просмотра изображений отдельно от сайта. Если сайт не позволяет открывать изображение в новой вкладке или окне, просмотр элемента делает это возможным.
-
Тинкер. Просмотр кода веб-страницы может помочь вам понять, что вы видите, сняв тайну того, что и почему происходит с сайтом, на котором вы находитесь. Это все равно, что разобрать электроприбор, чтобы посмотреть, как он работает, но в этом случае нельзя терять винты.
FAQ
Законно ли проверять сайт?
Да. Однако, если вы планируете использовать какой-либо код или ресурсы с веб-сайта, обязательно проконсультируйтесь с владельцем и добавьте примечание об авторских правах.
Как скопировать HTML с веб-сайта с элементом проверки?
В Chrome щелкните правой кнопкой мыши страницу и выберите Inspect, затем перейдите в верхний раздел и щелкните правой кнопкой мыши тег (например,). Выберите Copy > Copy externalHTML, затем вставьте код в текстовый или HTML-файл.
Можно ли скопировать CSS с веб-сайта с элементом проверки?
Да. Щелкните правой кнопкой мыши элемент, который хотите скопировать, и выберите Inspect. Щелкните правой кнопкой мыши выделенный код и выберите Копировать > Копировать стили.
Как просмотреть сохраненные пароли с помощью элемента проверки?
Чтобы открыть скрытые пароли, щелкните правой кнопкой мыши текстовое поле пароля и выберите Проверить. В выделенном разделе найдите type="password" и замените password на text. Есть более простые способы показать все ваши пароли в Chrome.
