Веб-Консоль Помощь

Перевод не завершен. Пожалуйста, помогите перевести эту статью с английского.

Команды

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

$()
Ищет CSS-селектор, возвращая первый найденный элемент. Эквивалентно document.querySelector() или же вызывается функция $, в случае, если таковая найдена на странице.
$$()
Ищет CSS-селектор, возвращая перечень соответствующих ему DOM-узлов. Это упрощённый вариант, используемый вместо document.querySelectorAll().
Начиная с билда Firefox 41 этот метод больше не является упрощением для document.querySelectorAll(), а наоборот возвращает массив элементов.
$0
Ныне исследуемый элемент страницы.
$_
Появилась в Firefox 39. Хранит результат последнего выражения, выполненного через командную строку. Например, если вы введёте "2+2 <enter>", затем "$_ <enter>", то консоль ответит "4".
$x()
Оценивает XPath-выражение и возвращает массив соответствующих ему узлов.
keys()
Задаёт объект, возвращает перечень ключей (или имён свойств) характерных объекту. Является упрощённым вариантом Object.keys.
values()
Задаёт объект, возвращает перечень значений объекта; является дополнением для keys().
clear()
Очищает область вывода консоли.
inspect()
Задаёт объект, открывает инспектор объектов.
pprint()
Форматирует указанные значения до читаемого вида; полезно для дампа содержимого объектов и массивов.
help()
Показывает текст помощи. На самом деле (вот восхитительный пример рекурсии) он приведет вас к этой странице.
cd()
Переключает механизм оценки контекста JavaScript к другому айфрейму, имеющемуся на странице. Смотрите страницу работа с айфреймами.
copy()
Появилась в Firefox 38. Копирует аргумент в клипборд. Если аргумент является строкой, то он копируется как есть. Если аргумент является DOM-узлом, то копируется его outerHTML. Можно также использовать функцию JSON.stringify, которая также вызовет аргумент и скопирует его значение в клипборд.
clearHistory()
Появилась в Firefox 39. Как и любая другая командная строка, Веб-консоль помнит введённые вами команды. Используйте функцию для очистки истории командной строки.
Пожалуйста, обратитесь к тексту API консоли для получения большей информации о записи контента.

Примеры

Пример: Смотрим на содержимое DOM-узлов

Допустим, у вас есть DOM-узел с ID "title". На самом деле такой ID есть и у страницы, которую вы сейчас читаете, т.е. вы можете открыть Веб-консоль и попробовать прямо сейчас.

Давайте посмотрим на содержимое этого узла, используя функции: $() и inspect()

inspect($("#title"))

Автоматически откроется окно объектного инспектора, показывающее содержимое DOM-узла, соответствующего CSS-селектору "#title", являющемуся элементом ID "title".

Пример: Дамп содержимого DOM-узла

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

pprint($("#title"))

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

Метки документа и участники

 Внесли вклад в эту страницу: pronweb, Aleksej, Igor_V_Belousov
 Обновлялась последний раз: pronweb,