[JavaScript]-1-js的三种导入方式

引言

这篇文章介绍HTML文档中,JavaScript的三种常见的导入方式。

文章目录

0×1.标签行内导入

可以将js语句嵌套在其他标签中,常见用法如下,将js函数嵌套在按钮中,当用户按下按钮时,弹出弹窗提示信息:

上面这个按钮的代码如下:

					<input type="button" value="按我测试" onclick="alert('QingSword.COM')" />
					

0×2.使用script标签导入

除了可以将js函数嵌套在其他标签中外,还能直接将js函数放在script标签中:

					<script>
						alert('QingSword.COM');
					</script>
					

将这段代码放到HTML文档中,能够实现打开页面就弹出对话框的效果。

0×3.外部文件导入

外部文件的导入优先级要高于使用script标签导入,请看下面的实例:

					//虽然script标签中内嵌了alert('QingSword.COM'),但不会被执行,因为src属性指向了一个外部js文件,会忽略掉script标签内嵌套的js语句
					<script src="src/welcome.js">
						alert('QingSword.COM');
					</script>

					//在当前文档的相对目录src下创建一个welcome.js文件,内容如下
					alert('Welcome to my website QingSword.COM');
					

如果查看源代码,就会发现,在这一行的下面,我插入了一个script标签,从外部引用了welcome.js文件,这就是打开这个页面会弹窗“Welcome to my website QingSword.COM”的原因;

以上就是html文档中导入js的三种方式。