当前位置：
文档之家› 第1章 JavaScript概述
第1章 JavaScript概述
var width,height,S; width=prompt("请长方形的宽（单位米）",10);
height=prompt("请长方形的高（单位米）",20);
S=parseInt(width)*parseInt(height); alert("长方形的面积为"+S); </script>
谢谢大家
1.4 JavaScript程序编写、运行与调试
1.4.2 运行JavaScript程序
【示例1-4】输入年龄信息，编码如下：（同步练习）
项目演示
1.4 JavaScript程序编写、运行与调试
1.4.3 调试JavaScript程序
（1）语法错误
语法错误是在程序开发中使用不符合某种语言规则的语句，从而 产生的错误被称为语法错误。错误地使用了JavaScript的关键字，错 误地定义了变量名称等。 <script language="javascript"> document.write(“欢迎来到 JavaScript 世界”)； prompt("请输入你的年龄",20); alert("测试成功！"); </script>
1.1 JavaScript简述
1.1.2 JavaScript的特点
解释型脚本语言（程序运行被逐行解释 ，与HTML类似）
基于对象的语言（基于对象，具有属性、方法交互）
简单性 （基于Java基本语句 ，数据弱类型） 安全性 （不允许访问本地硬盘 ，不能将数据存入服务器 上，
不允许对网络文档进行修改和删除）
（2）逻辑错误 输出为何不是60， 而是2040？
虽然用户输入的是数字10和20，但prompt（）返回的 是输入的字符串，也就是“10”和“20”，所以语句： C=2*(width+height)中变量width和height都是字符串类型， 上述语句相当于：C=2*("10"+"20" )，所以出现了“2040” 的结果。 输入的参数需要通过parselent( )函数转换为整数。 代码为： C=2*(parseInt(width)+ parseInt(height));
<html> <head> <title>欢迎来到 JavaScript 世界!</title> </head> <body> <script language="javascript"> //JavaScript代码 document.write("欢迎来到 JavaScript 世界"); </script> </body> </html>
1.5 实例1：JavaScript基本操作
1.编写JS程序，求长方形的面积，并显示结果
计算矩形面积
height
S（面积）
width
1.5 实例1：JavaScript基本操作
1.编写JS程序，求长方形的面积，并显示结果
<script language="javascript">
document.write("求长方形的面积");
教师演示
1.3 编写JavaScript的工具
1.3.2 使用Dreamweaver编辑JavaScript程序
教师演示
1.4 JavaScript程序编写、运行与调试
1.4.1 编写JavaScript代码
【示例1-4】输入年龄信息，编码如下：（同步练习）
<html> <head><title>欢迎学习JavaScript程序!</title></head> <body> <script language="javascript"> document.write("欢迎来到 JavaScript 世界"); prompt("请输入你的年龄",20); alert("测试成功！"); </script> </body> </html>
项目演示
1.2 JavaScript的使用方法与工作原理
1.2.1 JavaScript的使用方法
方法二、将JavaScript源文件链接到Html文档 。 【示例1-2】调用外部js.html （同步练习）
<html> <head><title>欢迎来到 JavaScript 世界!</title></head> <body> <script language="javascript" src="jstest.js"></script> </body> </html>
1.1 JavaScript简述
1.1.1 JavaScript的简介
JavaScript 是一种Web页面中的一种脚本编程语言， 也是一种通用的、跨平台的、基于对象和事件驱动并具 有安全性的脚本语言。它不需要进行编译，而是直接嵌
入到HTML页面中，把静态页面转变成支持用户交互并
响应事件的动态页面。
返回响应
3
1.3 编写JavaScript的工具
1.3.1 记事本编辑JavaScript程序
【示例1-3】使用记事本编写JavaScript程序（同步练习）
<html> <head> <title>Hello JavaScript! !</title> </head> <body> <script language="javascript"> window.alert("Hello JavaScript!"); </script> </body> </html>
动态性 （事件驱动方式 ，直接对用户或客户输入做出响应 ） 跨平台性 （依赖于浏览器，与操作系统环境无关 ）
1.1 JavaScript简述
1.1.3 JavaScript的应用
1.验证数据
项目演示 2.动画效果
项目演示
1.1 JavaScript简述
1.1.3 JavaScript的应用
3.窗口应用
项目演示 4.结合Flash综合效果
项目演示
1.2 JavaScript的使用方法与工作原理
1.2.1 JavaScript的使用方法
方法一、使用<script>标签将JavaScript语句直接嵌入文档。 <script>标记的使用格式： <script language="JavaScript">
JavaScript程序设计
第1章 JavaScript概述
安徽工商职业学院软件教研室
第1章 JavaScript概述
本章要点
1. JavaScript的简介 2. JavaScript的特点 3. JavaScript相关应用 4. JavaScript的使用方法 5. JavaScript的工作原理 6. 编写JavaScript的工具 7. JavaScript编写、运行与调试 8. 实例：JavaScript基本操作
【示例1-2】调用外部jstest.js
document.write("欢迎来到 JavaScript 世界");
项目演示
1.2 JavaScript的使用方法与工作原理
1.2.2 JavaScript的工作原理
客户端请求含JS的页面
2
发送请求 IE
1
用户输入
IE
解析HTML标签和 JavaScript脚本 应用 服务器 从服务器端下载含 JavaScript的页面
教师演示
标点符号错误 使用中文分号
（2）逻辑错误
程序不存在语法错误，也没有执行非法操作的语句，可是程序运 行时的结果却是不正确的，这种错误叫做逻辑错误 。 例如判断某人名字是不是叫“Bill”，但编写程序时却少写了一个l， 变成了“Bil”，或者将l写成了1，变成了“Bil1”，此时就会发生逻辑错 误。 <script language="javascript"> document.write("求长方形的周长"); var width,height,C; width=prompt("请长方形的宽（单位米）",10); height=prompt("请长方形的高（单位米）",20); C=2(width+height); 逻辑错误 alert("长方形的周长为"+C); C=2*(width+height); </script>
JavaScript使用规则
语句以分号（;）结束 区分大小写 <script>成对使用 使t; </script>
1.2 JavaScript的使用方法与工作原理
1.2.1 JavaScript的使用方法
【示例1-1】欢迎来到JS 世界（同步练习）
