[JavaScript tutorial] JavaScript events

HTML events occur on HTML elements. When JavaScript is used on an HTML page, JavaScript can trigger these events.

JavaScript events

HTML events occur on HTML elements.

When JavaScript is used on an HTML page, JavaScript can trigger these events.

HTML event

HTML events can be browser behaviors or user behaviors.

The following are examples of HTML events:

HTML page loaded

When the HTML input field is changed

HTML button clicked

Generally, you can do something when an event occurs.

JavaScript can execute some code when an event is triggered.

You can add event properties to HTML elements and use JavaScript code to add HTML elements.

Single quotes:

Double quotation marks:

In the following example, The onclick attribute (with Code) is added to the button element ):

Instance

The time is?

In the preceding example, the JavaScript code modifies the content of the id = "demo" element.

In the next instance, the code will modify the content of its own elements (using this. innerHTML ):

Instance

The time is?

JavaScript code is usually a few lines of code. It is common to call through event properties:

Instance

The time is?

Common HTML events

The following is a list of common HTML events:

Event

Description

Onchange HTML element change

Onclick: the user clicks the HTML element.

Onmouseover move the mouse over an HTML Element

The onmouseout user removes the mouse from an HTML Element

Onkeydown the user presses the keyboard button

The onload browser has completed page loading.

More event lists: JavaScript reference manual-html dom events.

What can JavaScript do?

Events can be used to process form verification, user input, user behavior, and browser actions:

Trigger events during page loading

Trigger an event when the page is closed

The user clicks the button to execute the action.

Verify validity of user input

And so on...

You can use multiple methods to execute JavaScript Event code:

HTML event attributes can directly execute JavaScript code

HTML event attributes can call JavaScript Functions

You can specify your own event handler for the HTML element.

You can prevent an event.

And so on...

In the html dom section, you will learn