js的引入方式
1)直接在HTML页面中使用<script></script>标签引入,可以写在head中,也可以写在body末尾,可以实现
<code class="language-html"><!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <title>js引入方式实验</title> </head> <body> <button id="button">实验</button> <script> button.onclick = function () { alert("引入方法一:直接嵌入script标签"); } </script> </body> </html></code>
2).在html中使用script的src属性引入外部js文件,可实现。
新建一个index1.html和index1.js文件,代码如下:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>js引入方式实验</title>
</head>
<body>
js的引入方式实验
<button id="button">实验</button>
<script src="index1.js">
</script>
</body>
</html>
3).事件定义,直接在组件后面的事件中写javascript:js代码,可实现
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>js引入方式实验</title>
</head>
<body>
js的引入方式实验
<button id="button" onclick="javascript:alert('js引入的方式3:事件定义')">实验</button>
</body>
</html>
4).在一个js文件中调用另外一个js 文件,可实现。但不能直接在第一个js文件中写<script src=xx.js></script>,这样写会导致引入js文件失败
HTML文件中引入index1-1.js
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>js引入方式实验</title>
</head>
<body>
js的引入方式实验
<button id="button">实验</button>
<script src="index1-1.js">
</script>
</body>
</html>