Four ways to embed JavaScript in HTML documents

This article mainly introduces 4 methods of embedding client-side JavaScript code in HTML documents. Interested friends can refer to it, as follows:

Embedding JavaScript in HTML

There are 4 ways to embed client-side JavaScript code in HTML documents:

1. Embed inline, placed between 3f1c4e4b6b16bbbd69b2ee476dc4f83a and 16b6c3e5e787f2aeb2e3b002cff63d99 tags (less);

2. Place it in an external file specified by the src attribute of the 3f1c4e4b6b16bbbd69b2ee476dc4f83a tag (more);

3 . Place it in an HTML event handler that specifies it by an HTML attribute value such as onclick or onmouseover (rarely);

4. Place it in a URL that uses special Protocol "javascript" protocol (rarely);

0 - Attached: Script type

JavaScript is the original scripting language of the Web, by default Below, the 3f1c4e4b6b16bbbd69b2ee476dc4f83a element contains or references JavaScript code. If you want to use a non-standard scripting language, such as VBScript, you must use the type attribute to specify the MIME type of the script, for example:

<script type="text/vbscript"> 
 ... ... 
</script>

The default value of the type attribute is "text/javascript".

1——Inline 3f1c4e4b6b16bbbd69b2ee476dc4f83a element

For example:

 <script> 
 function displayTime(){ 
 ... ... 
 } 
 window.onload = displayTime; 
</script>

2——Src attribute uses external The script

3f1c4e4b6b16bbbd69b2ee476dc4f83a tag in the file supports the src attribute, which specifies the URL of the file containing JavaScript code. Its usage is as follows:

Copy code The code is as follows:

<script src="../../scripts/util.js"></script>

When using the src attribute, anything between the 3f1c4e4b6b16bbbd69b2ee476dc4f83a2cacc6d41bbb37262a98f745aa00fbf0 tags will be ignored.

When you include a script in a page using the src attribute, you give the script full control over the Web page.

3——Event handler in HTML

When the HTML file where the script is located is loaded into the browser, the JavaScript code in this script will only be executed once . JavaScript code can register event handlers by assigning functions to properties of the Element object. This Element object represents an HTML element in the document.

For example:

Copy code The code is as follows:

<input type="checkbox" name="options" value="giftwrap" onchange="order.options.giftwrap = this.checked;">

The attributes of the event handler defined in HTML can contain any JavaScript statements, each of which Separate with commas. These statements form the body of a function, which then becomes the value of the corresponding event handler property.

4 - JavaScript in the URL

Following the URL with a javascript: protocol qualifier is another way to embed JavaScript code into the client. This special protocol type specifies that the URL content is an arbitrary string, which is JavaScript code that will be run by the JavaScript interpreter. It is treated as a separate line of code, which means statements must be separated by semicolons and comments must be replaced by /**/ comments. The resource recognized by javascript:URL is the return value of the executed code converted into a string. If the code returns undefined, then the resource has no content.

javascript: The URL can be anywhere a regular URL can be used: such as the href attribute of the 3499910bf9dac5ae3c52d5ede7383485 tag, the action attribute of ff9c23ada1bcecdd1a0fb5d5a0f18437, or even the parameters of the window.open() method.

The JavaScript URL in the hyperlink can be like this:

<a href="javascript:new Date().toLocaleTimeString();" rel="external nofollow" > 
What time is it? 
</a>

##

The above is the detailed content of Four ways to embed JavaScript in HTML documents. For more information, please follow other related articles on the PHP Chinese website!