教学项目十九 JavaScript函数与分支程序设计
【 教学内容 】
讲解 JavaScript函数定义, 使用及分支程序设计
【 教学目的 】
使学生掌握 JavaScript函数的定义, 学会设计简单分支结构的
JavaScript程序
【 教学重点 】
JavaScript运算符的使用
【 教学难点 】
表单对象元素的访问
【 教学方式 】
讨论式, 案例分析式, 练习式相结合
【 教学参考 】
1,<<JavaScript 入门与提高 >> 杨浩著 清华大学出版社
2,<<Internet 网页工场 >> Wittime工作室 重庆出版社
3,<<JavaScript从入门到精通 >> 电脑报社出版
4,<<JavaScript编程起步 >> 人民邮电出版社
5,<<Flash MX灵感设计 >> 电子工业出版社
【 教学过程 】
【 新课 】
一, 函数定义语句
1,function 函数名 （ 形参表 ）
{
,
,
.(函数执行部分 )
}
2,return
格式,
return 表达式
返回函数的值
案例一 设计网页,显示提示信息别碰我,当用户点击时, 会不断弹出信息窗口,
<html>
<body>
<script>
<!-- Script by Juan Valdez
function hate()
{
alert(' waiting ');
alert(' here');
alert(' just');
alert(' for');
alert(' you');
return hate()
}
//-- done -->
</script>
<a href="javascript:hate()" onclick="window.status='按了可就关不
掉了 !';">
<b>别碰我 </b></a>
</body>
</html>
案例二 分析程序执行的结果
<html>
<head>
<script>
function first(p,q)
{
p=p*2;
b=b+1;
var c=100;
document.writeln("P的值为,",p,"<br>");
document.writeln("a的值为,",a,"<br>");
document.writeln("b的值为,",b,"<br>");
document.writeln("c的值为,",c,"<br>");
}
var a=1,b=2,c=3;
first(a,b);
document.writeln("a的值为,",a,"<br>");
document.writeln("b的值为,",b,"<br>");
document.writeln("c的值为,",a,"<br>");
</script>
</html>
分析,
(1) 程序在函数体用 VAR定义变量为局部变量,其值不会影响函数外的同名
变量名 (如 c);
(2) 在函数内部改动一个外部变量的值,会使外部变量的值发生改变 (如 b)
案例三 设计检测手机号码的程序
分析,
(1) 手机号码应为 11位
obj.length=11
(2) 手机号码应以 13开头
obj.substring(0,1)=”13”
(3) 手机号码是由 0—9的数字 11位数字组成
使用函数 isNaN()测试字符串中是否有非数字字符
<html>
<body>
<script>
function aa(obj)
{
if(obj.length!=11) alert("手机号码应该是 11位数字 ");
else if(obj.substring(0,2)!=“13”) alert(“手机号码应该以 13开头
");
else if(isNaN(obj)) alert("手机号码应该是 11位数字 ");
else alert("你填的是正确的手机号码 ");
}
</script>
<form name=codeN>
示例,<input type=text name=No >
<input type=button value=' 提交 '
onclick=aa(document.codeN.No.value)>
</form>
</body>
</html>
【 课后小结 】
函数是实现一定功能的代码模块,要掌握函数的定义,调用方法 ;
在处理表单并获取字段值时,例中使用的是语句
document.codeN.No.value,要明确每一部分的意义,
【 教学内容 】
讲解 JavaScript函数定义, 使用及分支程序设计
【 教学目的 】
使学生掌握 JavaScript函数的定义, 学会设计简单分支结构的
JavaScript程序
【 教学重点 】
JavaScript运算符的使用
【 教学难点 】
表单对象元素的访问
【 教学方式 】
讨论式, 案例分析式, 练习式相结合
【 教学参考 】
1,<<JavaScript 入门与提高 >> 杨浩著 清华大学出版社
2,<<Internet 网页工场 >> Wittime工作室 重庆出版社
3,<<JavaScript从入门到精通 >> 电脑报社出版
4,<<JavaScript编程起步 >> 人民邮电出版社
5,<<Flash MX灵感设计 >> 电子工业出版社
【 教学过程 】
【 新课 】
一, 函数定义语句
1,function 函数名 （ 形参表 ）
{
,
,
.(函数执行部分 )
}
2,return
格式,
return 表达式
返回函数的值
案例一 设计网页,显示提示信息别碰我,当用户点击时, 会不断弹出信息窗口,
<html>
<body>
<script>
<!-- Script by Juan Valdez
function hate()
{
alert(' waiting ');
alert(' here');
alert(' just');
alert(' for');
alert(' you');
return hate()
}
//-- done -->
</script>
<a href="javascript:hate()" onclick="window.status='按了可就关不
掉了 !';">
<b>别碰我 </b></a>
</body>
</html>
案例二 分析程序执行的结果
<html>
<head>
<script>
function first(p,q)
{
p=p*2;
b=b+1;
var c=100;
document.writeln("P的值为,",p,"<br>");
document.writeln("a的值为,",a,"<br>");
document.writeln("b的值为,",b,"<br>");
document.writeln("c的值为,",c,"<br>");
}
var a=1,b=2,c=3;
first(a,b);
document.writeln("a的值为,",a,"<br>");
document.writeln("b的值为,",b,"<br>");
document.writeln("c的值为,",a,"<br>");
</script>
</html>
分析,
(1) 程序在函数体用 VAR定义变量为局部变量,其值不会影响函数外的同名
变量名 (如 c);
(2) 在函数内部改动一个外部变量的值,会使外部变量的值发生改变 (如 b)
案例三 设计检测手机号码的程序
分析,
(1) 手机号码应为 11位
obj.length=11
(2) 手机号码应以 13开头
obj.substring(0,1)=”13”
(3) 手机号码是由 0—9的数字 11位数字组成
使用函数 isNaN()测试字符串中是否有非数字字符
<html>
<body>
<script>
function aa(obj)
{
if(obj.length!=11) alert("手机号码应该是 11位数字 ");
else if(obj.substring(0,2)!=“13”) alert(“手机号码应该以 13开头
");
else if(isNaN(obj)) alert("手机号码应该是 11位数字 ");
else alert("你填的是正确的手机号码 ");
}
</script>
<form name=codeN>
示例,<input type=text name=No >
<input type=button value=' 提交 '
onclick=aa(document.codeN.No.value)>
</form>
</body>
</html>
【 课后小结 】
函数是实现一定功能的代码模块,要掌握函数的定义,调用方法 ;
在处理表单并获取字段值时,例中使用的是语句
document.codeN.No.value,要明确每一部分的意义,
