Home > Article > Web Front-end > There are several ways to use javascript code
There are two ways to use JavaScript code, namely: 1. Direct execution. When a web page is opened, all JavaScript codes defined in script tags or linked js files will be executed; 2. Events Driver, when a certain event occurs, execute a certain piece of JavaScript code.
The operating environment of this tutorial: windows7 system, javascript version 1.8.5, Dell G3 computer.
[JavaScript execution method]
The JavaScript code defined in the HTML document has two execution methods: direct execution and event-driven.
Direct execution:
When we open a web page, all JavaScript code defined in the 3f1c4e4b6b16bbbd69b2ee476dc4f83a tag or linked js file will will be executed.
It should be noted that functions defined with function are not executed. The function will only be executed when it encounters a function call.
Example 1:
<script type="text/javascript"> var d = new Date(); var m = d.getMonth(); if( m>=5 ) document.write( m ); </script>
The above JavaScript code is placed naked in the 3f1c4e4b6b16bbbd69b2ee476dc4f83a tag, and will be executed immediately when the web page is opened.
Example 2:
<script type="text/javascript"> function getM() { var d = new Date(); var m = d.getMonth(); if( m>=5 ) document.write( m ); } </script> 以上JavaScript代码定义的是函数,当网页打开时,函数中的代码不会被执行。当需要执行该函数时,需要使用函数调用。 <script type="text/javascript"> getM(); </script>
Event-driven:
When an event occurs, such as a web page being opened, a mouse click, a double-click, etc., Execute a piece of JavaScript code.
For example:
<script type="text/javascript"> var count = 0; function setCount() { count++; if( count>=5 ) count = 0; } </script> <button onclick="setCount()">计数</button>
In this example, the bb9345e55eb71822850ff156dfde57c8 tag defines a button, and the onclick attribute is used to respond to a mouse click event. When the button is clicked with the mouse , execute the setCount() function.
The attributes that respond to an event in the tag are called event handlers, and their values are JavaScript codes.
Common event handles:
onload:
Triggered when the web page is opened. It is only valid within the 6c04bd5ca3fcae76e30b72ad730ca86d and f900b4fc197b16ab214eecf015bb6bd2 tags.
This event is generally used to perform some initialization operations.
onunload:
Triggered when the web page is closed. It is only valid within the 6c04bd5ca3fcae76e30b72ad730ca86d and f900b4fc197b16ab214eecf015bb6bd2 tags.
This event is generally used to complete some finishing work.
onclick:
Triggered when the mouse clicks. It can be used for objects such as controls, images, text, hyperlinks, etc.
This event is used to respond to mouse click operations and is the most commonly used event handler.
ondblclick:
Triggered when the mouse is double-clicked. It can be used for objects such as controls, images, text, hyperlinks, etc.
This event is used to respond to a mouse double-click operation.
onchange:
Triggered when the content changes. It can be used for objects such as text boxes, list boxes, etc.
This event is generally used to respond to the user's operation of modifying the content in the text box.
Description: When the user enters text into a text box, the onchange event will not be triggered. This event will only be triggered when the user clicks an area outside the text box after completing the input, causing the text box to lose focus. .
onselect:
Triggered when the content is selected. It can be used for objects such as text boxes, list boxes, etc.
This event is generally used to respond to operations such as the user selecting the content in the text box and changing the selected item in the list box.
The above are just a few of the most commonly used event handlers.
Note: The event handler is not a JavaScript code, but an HTML attribute, so it is not case-sensitive, but you should develop the habit of writing in lowercase letters.
Extended information:
[JavaScript definition method]:
There are two ways to add JavaScript code to HTML documents: embedded and linked. Mode.
Embedded:
Embed JavaScript code in the HTML document. Method:
<script type="text/javascript"> JS代码 </script>
JavaScript code must be defined between 3f1c4e4b6b16bbbd69b2ee476dc4f83a and 2cacc6d41bbb37262a98f745aa00fbf0.
3f1c4e4b6b16bbbd69b2ee476dc4f83a Tags can be placed in the head area or in the body area.
In an HTML document, JavaScript code can appear in multiple places, and each place must be enclosed in 3f1c4e4b6b16bbbd69b2ee476dc4f83a tags.
Link-in:
Place the JavaScript code in a text file. The file extension should be defined as .js. Add the following tags to the HTML document:
<script type="text/javascript" src="js文件"></script>
The src attribute is used to specify the address of the linked js file. It can be a local file or a URL.
Using linking, the defined JavaScript code can be shared by multiple web pages.
[Recommended learning: javascript advanced tutorial]
The above is the detailed content of There are several ways to use javascript code. For more information, please follow other related articles on the PHP Chinese website!