本文介绍了HTML与JavaScript结合使用的三种常见方式：直接在script标签中编写JS代码、通过src属性引入外部JS文件以及混合使用这两种方式。并强调了无论采用何种方式，多个script标签中的变量都是共享的。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>js1---Html和JavaScript结合的方式</title>
<link rel="stylesheet" type="text/css" href="1.css">
<style type="text/css">
@IMPORT url("1.css");
</style>
<style type="text/css">
h2{
color: red;
}
</style>
</head>
<body>
<h2>Html和JavaScript结合的方式</h2>
方式1:直接在script标签中写 js 代码
<script type="text/javascript">
var a = 10;
//alert(a);
</script>
<br/><br/>
方式2:导入外部文件---在script标签中利用src属性指定外部js文件的位置及文件名
<script type="text/javascript" src="js/1.js"></script>
<br/><br/>
方式3:混合方式(既有脚本片段又有导入)---要分成多个script标签来写，每个标签采用一种(写脚本片段或导入)，不允许一个标签内同时采用两种
<!-- 反模式：混合方式不能这样写，否则脚本片段是不会执行的
<script type="text/javascript" src="js/1.js">
alert("aaa");
</script>
-->
<!-- 每一个script标签只能导入一个js文件 -->
<script type="text/javascript" src="js/2.js"></script>
<script type="text/javascript">
alert("y="+y);
y++;
</script>
<div>中间有一些HTML页面内容</div>
<script type="text/javascript">
alert("y2="+y);
</script>
<h3>无论采用什么方式，多个script标签中js代码的变量是共用的。同一个页面中的多个script标签中的脚本是属于同一个源程序，相互间变量和函数等是共享的！</h3>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>js1---Html和JavaScript结合的方式</title>
<link rel="stylesheet" type="text/css" href="1.css">
<style type="text/css">
@IMPORT url("1.css");
</style>
<style type="text/css">
h2{
color: red;
}
</style>
</head>
<body>
<h2>Html和JavaScript结合的方式</h2>
方式1:直接在script标签中写 js 代码
<script type="text/javascript">
var a = 10;
//alert(a);
</script>
<br/><br/>
方式2:导入外部文件---在script标签中利用src属性指定外部js文件的位置及文件名
<script type="text/javascript" src="js/1.js"></script>
<br/><br/>
方式3:混合方式(既有脚本片段又有导入)---要分成多个script标签来写，每个标签采用一种(写脚本片段或导入)，不允许一个标签内同时采用两种
<!-- 反模式：混合方式不能这样写，否则脚本片段是不会执行的
<script type="text/javascript" src="js/1.js">
alert("aaa");
</script>
-->
<!-- 每一个script标签只能导入一个js文件 -->
<script type="text/javascript" src="js/2.js"></script>
<script type="text/javascript">
alert("y="+y);
y++;
</script>
<div>中间有一些HTML页面内容</div>
<script type="text/javascript">
alert("y2="+y);
</script>
<h3>无论采用什么方式，多个script标签中js代码的变量是共用的。同一个页面中的多个script标签中的脚本是属于同一个源程序，相互间变量和函数等是共享的！</h3>
</body>
</html>
扫一扫
175
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
