课程体系颠覆升级
六维全息课程
新浪网、新浪教育频道主办的“2017中国教育盛典——教育之变” 于2017年11月28日在北京隆重举行，参会人员包括教育界知名专家学者、政府相关领导、校方代表、顶级教育投资人、教育机构负责人、教育创业精英、教育公益人士代表等，千锋因其在IT培训行业的影响力以及为IT培训行业做出的重要贡献，应邀参加了此次盛典，并荣获“2017中国口碑影响力职业培训机构”称号...
在网页中编写JavaScript代码时，有3种书写位置，分别是行内式、内嵌式（也称为嵌入式）和外部式（也称为外链式），下面分别进行讲解。
1. 行内式
行内式是指将单行或少量的JavaScript代码写在HTML标签的事件属性中（也就是以on开头的属性，如onclick）。下面通过具体操作步骤进行演示。
（1）创建一个简单的HTML页面，将文件命名为demo01.html。
（2）编写demo01.html，具体代码如下。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> </body> </html>
在上述代码中，第4行声明了网页的编码为UTF-8，帮助浏览器正确识别网页的编码。在声明编码后，还需要确保文件本身的编码也是UTF-8。目前大多数代码编辑器新建的文件编码默认都是UTF-8。另外，Windows记事本默认的编码是ANSI，在记事本中编写的网页容易出现乱码，因此读者应杜绝使用记事本编写代码文件。 （3）使用行内式编写JavaScript代码，实现单击一个按钮后，弹出一个警告框，显示一些提示信息，具体代码如下。
<body> <input type="button" value="点我" onclick="alert('行内式')"> </body>
在上述代码中，写在onclick属性里的代码就是JavaScript代码。
（4）通过浏览器访问demo01.html，运行结果如图1所示。
图1 行内式
以上步骤演示了行内式的使用。在实际开发中，使用行内式还需要注意以下4点。
① 注意单引号和双引号的使用。在HTML中推荐使用双引号，而JavaScript推荐使用单引号。
② 行内式可读性较差，尤其是在HTML中编写大量JavaScript代码时，不方便阅读。
③ 在遇到多层引号嵌套的情况时，非常容易混淆，导致代码出错。
④ 只有临时测试，或者特殊情况下再使用行内式，一般情况下不推荐使用行内式。
2. 内嵌式（嵌入式）
内嵌式是使用<script>标签包裹JavaScript代码，<script>标签可以写在<head>或<body>标签中。通过内嵌式，可以将多行JavaScript代码写在<script>标签中。内嵌式是学习JavaScript时最常使用的方式。
下面我们通过具体操作步骤进行演示。
（1）创建demo02.html，用来编写内嵌式JavaScript代码，示例代码如下。
<head> …… <script> alert('内嵌式'); </script> </head>
在上述代码中，第4行是一条JavaScript语句，其末尾的分号“;”表示该语句结束，后面可以编写下一条语句。<script>标签还有一个type属性，在HTML 5中该属性的默认值为“text/javascript”，因此在编写时可以省略type属性。
（2）通过浏览器访问demo02.html，页面一打开后，就会自动弹出一个警告框，提示信息为“内嵌式”。
3.外部式（外链式）
外部式是指将JavaScript代码写在一个单独的文件中，一般使用“js”作为文件的扩展名，在HTML页面中使用<script>标签进行引入，适合JavaScript代码量比较多的情况。
外部式有利于HTML页面代码结构化，把大段的JavaScript代码*到HTML页面之外，既美观，也方便文件级别的代码复用。需要注意的是，外部式的<script>标签内不可以编写JavaScript代码。
下面我们通过具体操作步骤进行演示。
（1）创建demo03.html，用来编写外部式JavaScript代码，示例代码如下。
<head> …… <script src="test.js"></script> </head>
（2）创建test.js文件，在文件中编写JavaScript代码，如下所示。
alert('外部式');
（3）通过浏览器访问demo03.html，页面一打开后，就会自动弹出一个警告框，提示信息为“外部式”。
猜你喜欢：
JavaScript数据类型：javascript数据类型有哪些？
变量是什么？JavaScript变量的命名声明与赋值讲解
JavaScript中怎么获取当前日期？
黑马程序员前端高级软件工程师培训
六维全息课程
CREA项目研发模型
百人讲师天团
学员就业均薪过万
HTML5
Java
Python
全链路设计
云计算
软件测试
新浪网、新浪教育频道主办的“2017中国教育盛典——教育之变” 于2017年11月28日在北京隆重举行，参会人员包括教育界知名专家学者、政府相关领导、校方代表、顶级教育投资人、教育机构负责人、教育创业精英、教育公益人士代表等，千锋因其在IT培训行业的影响力以及为IT培训行业做出的重要贡献，应邀参加了此次盛典，并荣获“2017中国口碑影响力职业培训机构”称号。千锋总部位于北京，现已在全国十四个城市成立分公司，多年来始终致力于打造IT教育全产业链人才服务平台，年培养中高端IT人才20000余人，坚持以人才需求为导向，为学员提供教学、就业一体化服务，是学员信赖的IT教育品牌，千锋专注于IT职业教育领域，现有HTML5培训、UI交互设计培训、PHP培训、Java+云数据培训、大数据开发培训、VR/AR/Unity游戏开发培训、Python人工智能培训、Linux云计算培训、全栈软件测试培训、Android培训、iOS培训，11大学科。
免费为您提供优质的机构
稍后会有专业老师给您回电，请保持电话畅通
易达招生网@版权所有 豫ICP备12014175号
本站文章由用户自行上传发布，如有侵权内容请及时联系我们删除。