Home  >  Article  >  Web Front-end  >  In-depth understanding of the two methods of introducing JS files into HTML pages

In-depth understanding of the two methods of introducing JS files into HTML pages

yulia
yuliaOriginal
2018-10-10 10:25:218788browse

A complete page consists of HTML (structure), CSS (performance) and JavaScript (behavior). So do you know how to introduce JS files into HTML pages? This article will tell you about two methods of introducing JS files into HTML pages. Friends who are interested can refer to it. I hope it can help you!

To introduce JS files into HTML pages, you must use the 3f1c4e4b6b16bbbd69b2ee476dc4f83a tag, because the 3f1c4e4b6b16bbbd69b2ee476dc4f83a tag will tell JavaScript where to start execution and where to end.

1. Import JS files externally

Import JS files under the b2386ffb911b14667cb8f0f91ea547a7 tag and in the 93f0f5c25f18dab9d176bd4f6de5d30e tag, so that HTML files and JS files can be Separation, thereby achieving the effect of front-end and back-end separation, and it is more convenient to write and modify code in this way. The same JS file can be referenced by multiple HTML pages, so in the project we generally use externally imported JS files.

The code for externally introducing JS files is as follows:

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title></title>
  <script type="text/javascript" src="js/index.js" ></script>
 </head>
 <body>
  <p id="demo">点击按钮将数组转为字符串</p>
  <button onclick="myFunction()">点击</button>
 </body>
</html>

2. Embed JS files in HTML pages

Place JavaScript in < of HTML pages In the ;body> tag, we usually place the JS file at the bottom of the page so that it will not interfere with the content of the page. When you first learn JavaScript, you will embed JS files in HTML pages because it is relatively simple. The embedding method is suitable for situations where there is not much code, such as writing a small test.

The code for embedding JS files in HTML pages is as follows:

<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title></title>
 </head>
 <body>
  <p id="demo">点击按钮将数组转为字符串</p>
  <button onclick="myFunction()">点击</button>
 </body>
 <script type="text/javascript">
  function myFunction(){
   var animal = ["dog", "cat", "elephant", "tiger"];
   var str=animal.toString();
   document.write("类型是:"+typeof(str)+",字符串是:"+str);   
  }
 </script>
</html>

The above introduces two methods of introducing JS files into HTML pages. Each has its own advantages and disadvantages. As for which method to choose, Depending on work needs and personal habits, beginners can try it themselves. I hope this article will be helpful to you!

For more related tutorials, please visit JavaScript video tutorial php public welfare training

The above is the detailed content of In-depth understanding of the two methods of introducing JS files into HTML pages. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn