3. 在HTML中嵌入JavaScript脚本

要想执行浏览器解释和执行JavaScript代码，就必须将JavaScript嵌入到HTML页面中去。

将JavaScript代码嵌入到HTML中有三种方法：

  1. 通过<script>标签嵌入
  2. 引入JavaScript外部脚本
  3. 在HTML属性中直接嵌入（不推荐）

1. 通过<script>标签嵌入

　　通过<script>嵌入JavaScript代码，必须将JavaScript代码放在<script type="text/javascript"> 和 </script>标记对中间。

　　通过<script>标签嵌入：　

 1 <!doctype html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>通过&lt;script&gt;嵌入JavaScript脚本</title>
 6     <!--开始嵌入JavaScript脚本-->
 7     <script type="text/javascript">
 8         document.write("通过&lt;script&gt;嵌入JavaScript脚本");
 9     </script>    
10     <!--结束-->
11 </head>
12 <body>    
13 </body>
14 </html>

2. 引入外部JavaScript脚本

　　在前端开发中，提倡结构（HTML）、表现（CSS）、行为（JavaScript）分离，那么这是就会通过引入外部JavaScript甲苯来实现。

　　引入外部JavaScript脚本：

1 <!--引入网站根目录下的js文件-->
2 <script type="text/javascript" src="/jquery.js"></script>
3 <!--引入script目录下的js文件-->
4 <script type="text/javascript" src="../script/jquery.js"></script>
5 <!--引入网络开源项目的js文件-->
6 <script type="text/javascript" src="http://code.jquery.com/jquery.js"></script>

　　引入JavaScript外部脚本，可以实现多个页面使用相同的JavaScript代码。外部脚本一般会被浏览器保存在缓存文件中，用户再次访问该页面时，无需重复载入，加快了网页打开速度。

3. 在HTML属性中直接嵌入（不推荐）

　　在HTML属性中嵌入JavaScript脚本，主要针对JavaScript事件。用户对页面进行操作后，页面做出的响应。

　　 1 <p ondblclick="alert('你已经双击了我！');">请双击这里</p> 

　　说明：alert()是一个弹出警告框函数。

脚本嵌入的位置

　　<script> 标签嵌入的脚本和外部引入的脚本可以放在 <head> 标签和 <body> 标签的任意位置。

 

posted @ 2015-06-04 15:39  marmotua  阅读(1348)  评论(0)    收藏  举报