Предположим, вы тестируете доступность навигации по странице с помощью клавиатуры. При навигации по странице с помощью клавиши Tab кольцо фокусировки иногда пропадает, поскольку элемент, на котором находится фокус, скрыт. Чтобы отслеживать элемент в фокусе в DevTools:
- Откройте Консоль .
Нажмите «Создать живое выражение». .
Дополнительные сведения см. в разделе Просмотр значений JavaScript в режиме реального времени с помощью Live Expressions .
Введите
document.activeElement
.Нажмите за пределами пользовательского интерфейса Live Expression, чтобы сохранить.
Значение, которое вы видите ниже document.activeElement
является результатом выражения. Поскольку это выражение всегда представляет элемент, находящийся в фокусе, теперь у вас есть способ всегда отслеживать, какой элемент находится в фокусе.
- Наведите указатель мыши на результат, чтобы выделить выделенный элемент в области просмотра.
- Щелкните результат правой кнопкой мыши и выберите «Показать на панели элементов» , чтобы отобразить элемент в дереве DOM на панели «Элементы» .
- Щелкните результат правой кнопкой мыши и выберите «Сохранить как глобальную переменную» , чтобы создать ссылку на переменную для узла, которую можно использовать в консоли .
Предположим, вы тестируете доступность навигации по странице с помощью клавиатуры. При навигации по странице с помощью клавиши Tab кольцо фокусировки иногда пропадает, поскольку элемент, на котором находится фокус, скрыт. Чтобы отслеживать элемент в фокусе в DevTools:
- Откройте Консоль .
Нажмите «Создать живое выражение». .
Дополнительные сведения см. в разделе Просмотр значений JavaScript в режиме реального времени с помощью Live Expressions .
Введите
document.activeElement
.Нажмите за пределами пользовательского интерфейса Live Expression, чтобы сохранить.
Значение, которое вы видите ниже document.activeElement
является результатом выражения. Поскольку это выражение всегда представляет элемент, находящийся в фокусе, теперь у вас есть способ всегда отслеживать, какой элемент находится в фокусе.
- Наведите указатель мыши на результат, чтобы выделить выделенный элемент в области просмотра.
- Щелкните результат правой кнопкой мыши и выберите «Показать на панели элементов» , чтобы отобразить элемент в дереве DOM на панели «Элементы» .
- Щелкните результат правой кнопкой мыши и выберите «Сохранить как глобальную переменную» , чтобы создать ссылку на переменную для узла, которую можно использовать в консоли .