Home > Article > Web Front-end > [JavaScript Tutorial] JavaScript Usage
JavaScript Usage
Scripts in HTML must be located between the 3f1c4e4b6b16bbbd69b2ee476dc4f83a and 2cacc6d41bbb37262a98f745aa00fbf0 tags.
Scripts can be placed in the 6c04bd5ca3fcae76e30b72ad730ca86d and 93f0f5c25f18dab9d176bd4f6de5d30e sections of the HTML page.
3f1c4e4b6b16bbbd69b2ee476dc4f83a Tag
To insert JavaScript into an HTML page, use the 3f1c4e4b6b16bbbd69b2ee476dc4f83a tag.
3f1c4e4b6b16bbbd69b2ee476dc4f83a and 2cacc6d41bbb37262a98f745aa00fbf0 tell JavaScript where to start and end.
The lines between 3f1c4e4b6b16bbbd69b2ee476dc4f83a and 2cacc6d41bbb37262a98f745aa00fbf0 contain JavaScript:
<script> alert("我的第一个 JavaScript"); </script>
You don’t need to understand the code above. Just understand that the browser will interpret and execute the JavaScript code between 3f1c4e4b6b16bbbd69b2ee476dc4f83a text/javascript". This is no longer necessary. JavaScript is the default scripting language in all modern browsers as well as in HTML5.
6c04bd5ca3fcae76e30b72ad730ca86d JavaScript in
In this example, JavaScript writes text to the HTML's 6c04bd5ca3fcae76e30b72ad730ca86d when the page loads:
Example
<!DOCTYPE html> <html> <body> . . <script> document.write("<h1>这是一个标题</h1>"); document.write("<p>这是一个段落</p>"); </script> . . </body> </html>
JavaScript functions and events
In the example above JavaScript statements that will be executed when the page loads.
Usually, we need to execute code when an event occurs, such as when the user clicks a button.
If we put the JavaScript code into a function, we can call the function when the event occurs.
You will learn more about JavaScript functions and events in later chapters.
JavaScript in 93f0f5c25f18dab9d176bd4f6de5d30e or 6c04bd5ca3fcae76e30b72ad730ca86d
You can put an unlimited number of scripts in your HTML document.
Scripts can be in the 6c04bd5ca3fcae76e30b72ad730ca86d or 93f0f5c25f18dab9d176bd4f6de5d30e sections of HTML, or both.
The usual approach is to put the function in the 93f0f5c25f18dab9d176bd4f6de5d30e section, or at the bottom of the page. This allows them to be placed in the same location without interfering with the content of the page.
JavaScript function in 93f0f5c25f18dab9d176bd4f6de5d30e
In this example, we place a JavaScript function into the 93f0f5c25f18dab9d176bd4f6de5d30e section of the HTML page.
This function will be called when the button is clicked:
JavaScript function in instance
<!DOCTYPE html> <html><head> <script> function myFunction() { document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数"; } </script> </head> <body> <h1>我的 Web 页面</h1> <p id="demo">一个段落</p> <button type="button" onclick="myFunction()">尝试一下</button> </body> </html>
6c04bd5ca3fcae76e30b72ad730ca86d
In this example, we place a JavaScript function into the 6c04bd5ca3fcae76e30b72ad730ca86d section of the HTML page.
This function will be called when the button is clicked:
Instance
<!DOCTYPE html> <html> <body><h1>我的 Web 页面</h1> <p id="demo">一个段落</p> <button type="button" onclick="myFunction()">尝试一下</button> <script> function myFunction() { document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数"; } </script> </body> </html>
External JavaScript
You can also save the script to an external file. External files often contain code used by multiple web pages.
The file extension for external JavaScript files is .js.
If you need to use an external file, please set the .js file in the "src" attribute of the 3f1c4e4b6b16bbbd69b2ee476dc4f83a tag:
Example
<!DOCTYPE html> <html> <body> <script src="myScript.js"></script> </body> </html>
你可以将脚本放置于 93f0f5c25f18dab9d176bd4f6de5d30e 或者 6c04bd5ca3fcae76e30b72ad730ca86d中 实际运行效果与您在 3f1c4e4b6b16bbbd69b2ee476dc4f83a 标签中编写脚本完全一致。
外部脚本不能包含 3f1c4e4b6b16bbbd69b2ee476dc4f83a 标签。
以上就是【JavaScript教程】JavaScript 用法的内容,更多相关内容请关注PHP中文网(www.php.cn)!