Документ: свойство activeElement
Базовая линия Широко доступно
Эта функция хорошо зарекомендовала себя и работает на многих устройствах и версиях браузеров. Она доступна во всех браузерах с июля 2015 года.
activeElement только для чтения свойство интерфейса Document возвращает Element в DOM, который в данный момент имеет фокус.
Часто activeElement вернёт объект HTMLInputElement или HTMLTextAreaElement, если у него есть выделенный текст. В таком случае вы можете получить больше деталей, используя свойства объекта selectionStart и selectionEnd. В других случаях фокусированный элемент может быть элементом <select> (меню) или элементом <input>.
Обычно пользователь может нажать клавишу Tab, чтобы переместить фокус по странице среди элементов, которые могут получить фокус, и использовать пробел для активации элемента (например, для нажатия кнопки или переключения радиокнопки). Какие элементы могут получить фокус, зависит от платформы и текущей конфигурации браузера. Например, в системах macOS элементы, которые не являются текстовыми полями ввода, как правило, по умолчанию не могут получить фокус.
Примечание: Фокус (элемент, который получает события пользовательского ввода) не то же самое, что выделение (текущая выделенная часть документа). Текущее выделение можно получить, используя window.getSelection().
Значение
Примеры
HTML
<p>Select some text from one of the text areas below:</p> <form> <textarea name="ta-example-one" id="ta-example-one" rows="7" cols="40"> This is Text Area One. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec tincidunt, lorem a porttitor molestie, odio nibh iaculis libero, et accumsan nunc orci eu dui.</textarea > <textarea name="ta-example-two" id="ta-example-two" rows="7" cols="40"> This is Text Area Two. Fusce ullamcorper, nisl ac porttitor adipiscing, urna orci egestas libero, ut accumsan orci lacus laoreet diam. Morbi sed euismod diam.</textarea > </form> <p>Active element ID: <em id="output-element"></em></p> <p>Selected text: <em id="output-text"></em></p>
JavaScript
function onMouseUp(e) {
const activeTextarea = document.activeElement;
const selection = activeTextarea.value.substring(
activeTextarea.selectionStart,
activeTextarea.selectionEnd,
);
const outputElement = document.getElementById("output-element");
const outputText = document.getElementById("output-text");
outputElement.textContent = activeTextarea.id;
outputText.textContent = selection;
}
const textarea1 = document.getElementById("ta-example-one");
const textarea2 = document.getElementById("ta-example-two");
textarea1.addEventListener("mouseup", onMouseUp, false);
textarea2.addEventListener("mouseup", onMouseUp, false);
Результат
Спецификации
| Спецификация |
|---|
| HTML # dom-documentorshadowroot-activeelement-dev |
Совместимость с браузерами
| Рабочие столы | Мобильные устройства | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox для Android | Opera Android | Safari на iOS | Samsung Internet | WebView Android | |
activeElement |
2 | 12 | 3 | ≤12.1 | 7 | 18 | 4 | ≤12.1 | 7 | 1.0 | ≤37 |
См. также
© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Document/activeElement