Home >Web Front-end >JS Tutorial >Program code about the three ways of using js (inline js, internal js, external js)

Program code about the three ways of using js (inline js, internal js, external js)

青灯夜游forward: 2018-10-09 14:32:242751browse

This article mainly introduces to you the example code of the three ways of using js (inline js, internal js, external js). The editor thinks it is quite good. Now I will share it with you. Interested friends can refer to it. , the details are as follows:

1. Inline js: js is not written separately

<!DOCTYPE html> 
<html lang="en"> 
<head> 
 <meta charset="UTF-8"> 
 <title>js使用方式1：行内js</title> 
</head> 
<body> 
<input type="button" value="点击有惊喜" onclick="javascript:alert(&#39;哈哈哈哈&#39;)"> 
<!--onclick:点击触发一个事件，alert：弹出一个对话框--> 
</body> 
</html>

2. Internal js: the program in script can be used on the entire page

<!DOCTYPE html> 
<html lang="en"> 
<head> 
 <meta charset="UTF-8"> 
 <title>js使用方式2：内部js</title> 
 <script type="text/javascript"> 
  //声明一个函数(整个文档都可以使用) 
  function surprise() { 
   alert(&#39;恭喜你中了一百万&#39;)/*弹出框*/ 
  } 
 </script> 
</head> 
<body> 
<input type="button" value="点击有惊喜" onclick="surprise()"><!--调用函数--> 
<input type="button" value="点击" onclick="surprise()"> 
</body> 
</html>

3. External js: Many html pages can call the set js page

<!DOCTYPE html> 
<html lang="en"> 
<head> 
 <meta charset="UTF-8"> 
 <title>js使用方式3：外部js</title> 
 <!--很多html页面都可以调用js4.js页面--> 
 <script src="../../js/js4.js" type="text/javascript" charset="utf-8"> 
 </script> 
</head> 
<body> 
<input type="button" value="点击" onclick="test()"> 
</body> 
</html>

Summary: The above is the js introduced to you. The example code of the three usage methods (inline js, internal js, external js), I hope it will be helpful to everyone's learning.

Related recommendations:

php public welfare training video tutorial

JavaScript video tutorial

The above is the detailed content of Program code about the three ways of using js (inline js, internal js, external js). For more information, please follow other related articles on the PHP Chinese website!

php JavaScript html JS

Statement：

This article is reproduced at:jb51.net. If there is any infringement, please contact admin@php.cn delete

Previous article：Detailed graphic explanation of two methods of converting arrays to strings in JavaScriptNext article：Detailed graphic explanation of two methods of converting arrays to strings in JavaScript

See more

Program code about the three ways of using js (inline js, internal js, external js)

Related articles