如何在HTML网页引入JavaScript

最新推荐文章于 2024-10-09 09:57:09 发布

小董也不懂呀～

最新推荐文章于 2024-10-09 09:57:09 发布

阅读量1.1w

点赞数 3

文章标签： javascript html 前端

本文链接：https://blog.csdn.net/java_dwj/article/details/122460816

版权

方式一:

在HTML网页内,书写script标签,里面定义js代码

缺点:

1.js代码不能重复使用(不能在其他网页里使用)

2.HTML标签和js代码耦合,不便于后期维护修改

优点:

1.HTML网页和js代码写在一起,便于阅读和测试

小结:在开发环境中使用方式一(编写阶段)

方式二:

1.在外部定义一个js文件

2.在HTML网页内,通过script标签的src属性引入外部js文件

注意:引入时注意路径写正确

当前目录:直接写目标完整的文件名

上级目录: . ./目录文件名/目标完整文件名

缺点:

js代码是一个单独的文件,不便于阅读和调试

优点:

1.js代码可以重复利用

2.js代码和HTML网页解耦合,便于修改和维护

小结:在生产环境下使用(代码开发完毕上线),使用方式二

练习:需求:抽奖系统,随机抽取获奖的幸运用户

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<!-- 引入外部的js文件:定义的前端框架,提高开发效率 -->
		<script type="text/javascript" src="my.js"></script>
		<script>
			/**
			 * 需求:抽奖系统,随机抽取获奖的幸运用户
			 * 分析思路:
			 * 1.保存多个用户的姓名
			 * 2.随机的索引就可以了:通过随机索引获取数组中的人名*/
			 
			 //1.定义一个数组,保存姓名
			 
			 var arr= ["小脑","小平","小花","小何","老妖","二狗","孬种","呵呵","大鸟"];
			 
			 //2.使用外部框架定义好的方法
			 
			var index = getRandom(arr.length);
			
			//3.根据index从数组中获取人名:人名也是随机的
			
			var name =arr[index];
			document.write(name);
		</script>
	</body>
</html>