What is the javascript event object

In JavaScript, the event object (event) is an object used to record some relevant information when an event occurs; the event object is only generated when the event occurs, and can only be accessed within the event processing function. After all event handling functions have finished running, the event object is destroyed.

The operating environment of this tutorial: Windows 7 system, JavaScript version 1.8.5, Dell G3 computer.

What is an event object (event):

The event object is an object used to record relevant information when some events occur.

The event object will only be generated when an event occurs, and can only be accessed within the event processing function. After all event processing functions have finished running, the event object will be destroyed!

Note: In fact, the event has always existed (regardless of whether it is bound or monitored), it just has no event handler! ! !

JavaScript events are: specific moments of interaction that occur in the browser or document window; and the interaction between JavaScript and HTML is triggered by events.

Event handler:

Event handler: Our user’s click action on the page, mouse movement action, web page loading completion action, etc., can all be called events. Name,
That is: click, mousemove, load, etc. are all the names of events. The function that responds to an event is called an event handler, or an event listener.

Event types:

In JavaScript, events are divided into three major categories, namely general events, form events, and page events.

• UI events: such as load, unload, error, resize, scroll, select, DOMActive, are triggered when the user interacts with elements on the page.

• Focus events: such as blur, DOMFocusIn, DOMFocusOut, focus, focusin, focusout, are triggered when an element gains or loses focus. Among these events, the most important ones are blur and focus. One thing that needs attention is that this type of event will not bubble up!

• Mouse and wheel events: such as click, dblclick, mousedown, mouseenter, mouseleave, mousemove, mouseout, mouseover, mouseup, are triggered when the user performs operations on the page through the mouse.

• Rolling wheel events: mousewheel (all supported by IE6), DOMMouseScroll (supported by FF, the same effect as mousewheel). Triggered when using the mouse wheel.

• Text event: textInput, triggered when text is entered in the document.

• Keyboard events: keydown, keyup, keypress, triggered when the user performs operations on the page through the keyboard.

• Synthetic event: Newly added at DOM3 level, used to process the input sequence of IME. The so-called IME refers to the input method editor, which allows users to enter characters that cannot be found on the physical keyboard. There are three events: compositionstart, compositionupdate, and compositionend.

• Change events: DOMsubtreeModified, DOMNodeInserted, DOMNodeRemoved, DOMAttrModified, DOMCharacterDataModified, etc., triggered when the underlying DOM structure changes. IE8 - Not supported.

• Change name event: This event is triggered when the element or attribute name changes. It is currently deprecated!

  For the basic types of events, with the emergence and development of HTML5, various events such as HTML5 events, device events (single touch), touch events, touch events, and gesture events have been added

Other events are as follows

Resource events

##Event nameHe Triggered whenerrorWhen resource loading fails. abortWhen loading resources has been aborted. loadThe resource and its related resources have been loaded. beforeunloadThe window, document and its resources are about to be unloaded. unloadThe document or a dependent resource is being unloaded.

Network event

Event nameWhen is triggeredonlineThe browser has gained network access. offlineThe browser has lost network access.

WebSocket event

##Event nameopenmessageerrorclose

CSS animation event

When to trigger
WebSocket connection established.
Received a message via WebSocket.
The WebSocket connection was closed abnormally (for example, some data could not be sent).
The WebSocket connection has been closed.

Event name	When to trigger
animationstart	Triggered when a CSS animation starts.
animationend	Fires when a CSS animation completes.
animationiteration	Triggered when a CSS animation is restarted after completion.

CSS transition event

Event name	When to trigger
transitionstart	Triggered when the listening transition event starts.
transitionrun	Triggered when listening for transition events.
transitionend	Triggered when the listening transition event ends.

Print event

Event name	Ho Triggered when
beforeprint	Triggered when the printer is ready.
afterprint	Fires when the printer is turned off.

Clipboard event

Event name	When is triggered
cut	The selected text content has been cut and copied to the clipboard.
copy	The selected text content has been copied to the clipboard.
paste	The text content copied from the clipboard is pasted.

[Related recommendations: javascript learning tutorial]

The above is the detailed content of What is the javascript event object. For more information, please follow other related articles on the PHP Chinese website!