JavaScript свойство Event.type

Определение и применение

JavaScript свойство type объекта Event возвращает строковое значение, которое содержит тип события (имя под которым зарегистрирован обработчик события, или имя свойства обработчика события, без префикса on). Свойство доступно только для чтения.

Поддержка браузерами

Спецификация: dom.spec.whatwg

✓Поддерживается во всех основных браузерах с 2015 года.

Показать браузеры

ВсеКомпьютерыМобильные

Совместимостьapi.Event.type

Возможность	Компьютеры					Мобильные
	ChromeChrome	EdgeEdge	FirefoxFirefox	OperaOpera	SafariSafari	Chrome AndroidChromeAndroid	Firefox for AndroidFirefoxAndroid	Opera AndroidOperaAndroid	Safari on iOSSafariiOS	Samsung BrowserSamsungAndroid	WebView AndroidWebViewAndroid	WebView on iOSWebViewiOS
type	✓1	✓12	✓1.5	✓7	✓1	✓18	✓4	✓10.1	✓1	✓1.0	✓4.4	✓1

✓поддерживается◐с ограниченияминет поддержки?нет данных≤31 — не позднее версии 31

JavaScript синтаксис

event.type;

Спецификация

DOM Standard.

Пример использования

Типы событий одного нажатия

Нажмите ▶, затем кнопку Click в результате: под ней появятся типы событий mousedown, mouseup и click в порядке их возникновения.

index.html

HTML

<button>Click</button>

main.js

JavaScript

const button = document.querySelector('button')
button.addEventListener('click', appendEventType)
button.addEventListener('mousedown', appendEventType)
button.addEventListener('mouseup', appendEventType)

function appendEventType(event) {
    let newElem = document.createElement('span')
    newElem.innerHTML = event.type + ' '
    document.body.appendChild(newElem)
}

В этом примере мы с использованием метода querySelector() выбрали первый HTML элемент <button> (кнопка) в документе. С помощью метода addEventListener() зарегистрировали обработчики события "click" (нажатие левой кнопкой мыши на элементе), "mousedown" (нажатие кнопкой мыши на элементе) и "mouseup" (отпускание кнопки мыши с элемента) для элемента <button>. При возникновении одного из этих событий срабатывает функция, которая:

• С использованием JavaScript метода createElement() объекта Document создает новый пустой элемент <span>.
• С использованием свойства innerHTML и свойства type объекта Event добавляет в качестве содержимого нового элемента тип события, которое произошло и пробельный символ.
• С использованием метода .appendChild() объекта Node добавляет созданный элемент <span> элементу <body>.