Shulou(Shulou.com)06/03 Report--

This article mainly introduces how to import html into JavaScript, the article introduces in great detail, has a certain reference value, interested friends must read it!

There are two ways for html to import JavaScript: 1, embed JavaScript code using "js code" statement in the HTML page; 2, in HTML, introduce external JavaScript script files through the src attribute of the script tag.

The operating environment of this tutorial: windows7 system, javascript1.8.5 version, Dell G3 computer.

The method of importing JavaScript into html document

1. Embed the JavaScript code in the HTML document

Embedding a JavaScript script in a HTML page requires the use of tags, and users can write JavaScript code directly in the tags, as follows.

Step 1, create a new HTML document and save it as test.html.

Step 2, insert a tag inside the tag.

Step 3, set the type= "text/javascript" attribute for the tag.

The script type of the default tag in modern browsers is JavaScript, so you can omit the type attribute; if you consider compatibility with earlier versions of browsers, you need to set the type attribute.

Step 4, enter the JavaScript code in the tag

The first JavaScript program [xss_clean] (": https://www.php.cn/");

Step 5, save the web document, preview it in the browser, and display the effect as shown in the figure. In the JavaScript script, document represents the Web page document object; [xss_clean] () calls the write () method of the Document object to write the HTML string ": https://www.php.cn/"" in the source code of the current web page.

2. Introduce external JavaScript code script files into HTML documents.

JavaScript programs can be placed not only directly in HTML documents, but also in JavaScript script files. JavaScript script files are text files with a .js extension that can be edited using any text editor.

The commonly used text editors are notepad in Windows system, Vim in Linux system, Sublime Text, Notepad++ and so on. For beginners, it is recommended to use a text editor to write JavaScript code first, which helps us to remember JavaScript syntax, keywords, functions, and so on. When it comes to the actual development stage, you can choose some more professional code editors, such as Visual Studio Code (referred to as "VS Code"), WebStorm (charging), Atom, etc., which can improve the efficiency of development.

The steps to create a new JavaScript file are as follows.

Step 1, create a new text file and save it as test.js. Note that the extension .js indicates that the text file is of type JavaScript.

Step 2, open the test.js file and write the following JavaScript code in it.

Alert (": https://www.php.cn/");

Step 3, save the JavaScript file. It is recommended that you put the JavaScript file and the web file in the same directory. In the above code, alert () represents the method of the Window object, and calling this method will bring up a prompt dialog box showing the parameter string "Hi, JavaScript!".

JavaScript files cannot be run independently and need to be imported into a web page and executed through a browser. Use tags to import JavaScript files.

Step 4, create a new HTML document and save it as test.html.

Step 5, insert a tag inside the tag. Define the src property and set the property value to a URL string that points to an external JavaScript file. The code is as follows:

Step 6, save the web document, preview it in the browser, and display the effect as shown in the figure. Note: when using the < script > tag to include external JavaScript files, the default file type is Javascript. Therefore, regardless of whether the loaded file extension is .js or not, the browser will follow the JavaScript script to parse.

Tags that define src attributes should no longer contain JavaScript code. If the code is embedded, only the external JavaScript file is downloaded and executed, and the embedded code is ignored.

The above is all the contents of the article "how to import html into JavaScript". Thank you for reading! Hope to share the content to help you, more related knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.