javascript语法基础.ppt
张向军张向军subtitle stylesubtitle style JavaScript 语法基础语法基础运算符运算符运算符说 明示 例+加a=5+8-减a=8-5/除a=20/5*乘a=5*19%取模两个数相除的余数10%3=1+一元自加。该运算符带一个操作数,将操作数的值加 1。返回的值取决于+运算符位于操作数的前面或是后面将返回 x 自加运算后的值。x+将返回 x 自加运算前的值-一元自减。该运算符只带一个操作数。返回的值取决于-运算符位于操作数的前面或是后面-x 将返回 x 自减运算后的值。x-将返回 x 自减运算前的值算术运算符算术运算符-1-1实现步骤:1.使用DreamWeaver 或者FrontPage设计页面2.指定各个文本框的名称3.切换为代码视图,编写脚本代码4.浏览并调试numpricetotalprice算术运算符算术运算符-2-2function cal()var num=document.calform.num.value;var price=document.calform.price.value;var total=parseFloat(num)*parseFloat(price);document.calform.totalprice.value=total;计算总价并显示添加单击事件,单击按钮时调用“cal()”函数获取表单中输入的数据:document.表单名.表单元素名.value定义calcu()计算函数,实现两个数相乘的功能.定义函数的语法:function 函数名(参数列表)/JavaScript语句;比较运算符比较运算符比较运算符比较运算符 2-1 2-1 运算符运算符说说 明明示示 例例=等于。如果两个操作数相等,则返回真。a=b!=不等于。如果两个操作数不相等,则返回真。Var2!=5大于。如果左边的操作数大于右边的操作数,则返回真。Var1 var2小于。如果左边的操作数小于右边的操作数,则返回真。Var2 var1=小于等于。如果左边的操作数小于或等于右边的操作数,则返回真。Var2=4Var2=大于等于。如果左边的操作数大于或等于右边的操作数,则返回真。Var1=5Var1=var2比较运算符比较运算符function cal()var num=document.calform.num.value;var price=document.calform.price.value;var total=parseFloat(num)*parseFloat(price);document.calform.totalprice.value=total;if(total200)alert(你可以参加抽奖!);.其他代码略,同上例购买总价超过200,可以参加抽奖!运算符运算符逻辑运算符逻辑运算符运算符运算符值值说说 明明与(&)expr1&expr2只有当 expr1 和 expr2 同为真时,才返回真。否则,返回假。或(|)expr1|expr2如果其中一个表达式为真,或两个表达式同为真,则返回真。否则,返回假。非(!)!expr如果表达式为真,则返回假。如果为假,则返回真。逻辑运算符逻辑运算符function cal()var num=document.calform.num.value;var price=document.calform.price.value;var total=parseFloat(num)*parseFloat(price);document.calform.totalprice.value=total;if(total100)&(total200)&(total=500)alert(你可以获得价值50元的大礼包!);.其他代码略,同上例100200 之间,赠送价值20元的大礼包;200500之间,赠送价值50元的大礼包;if if 语句语句 2-12-1条件语句用于测试条件。条件语句用于测试条件。if(条件)JavaScript代码;语法:语法:如果要执行多个语句,必须将这些语句放在一对大括号()内。但如果只要执行一个语句,则可以省略大括号IfIf语句语句 2-22-2function cal()var num=document.calform.num.value;var price=document.calform.price.value;if(num!=“”)&(price!=“”)var total=parseFloat(num)*parseFloat(price);document.calform.totalprice.value=total;if(total100)&(total200)&(total=500)alert(你可以获得价值50元的大礼包!);.其他代码略,同上例如果输入框中的数据用户漏填了,出现NaN的 bug 为什么呢?if else if else 语句语句 2-12-1if(if(条件条件)/JavaScript /JavaScript代码代码;elseelse /JavaScript /JavaScript代码代码;语法:语法:If-elseIf-else语句语句 2-22-2function cal()var num=document.calform.num.value;var price=document.calform.price.value;if(num!=“”)&(price!=“”)var total=parseFloat(num)*parseFloat(price);document.calform.totalprice.value=total;if(total100)&(total200)&(total=500)alert(你可以获得价值50元的大礼包!);elsealert(价格或者数量没有填写!);.其他代码略,同上例提示没有填写购买数量或者价格?嵌套嵌套 if if 语句语句 2-12-1if(if(条件条件1)1)if(if(条件条件2)2)/JavaScript /JavaScript代码代码;语法:语法:嵌套嵌套IfIf语句语句 2-22-2function cal()var num=document.calform.num.value;var price=document.calform.price.value;if(num!=“”)&(price!=“”)if(parseFloat(num)0)alert(数量不能为负数!);return;if(parseFloat(price)0)alert(价格不能为负数!);return;var total=parseFloat(num)*parseFloat(price);document.calform.totalprice.value=total;elsealert(价格或者数量没有填写!);.其他代码略,同上例价格无意中输入负数,出现 bug 怎么办?switch switch 语句语句 2-12-115switch(表达式)case 常量1:JavaScript语句;break;case 常量2:JavaScript语句;break;.default:JavaScript语句;语法:语法:switchswitch语句语句 2-22-216function cal()var num=document.calform.num.value;var price=document.calform.price.value;var grade;var pay=document.calform.pay.value;switch(parseInt(pay)case 1:grade=0.9;break;case 2:grade=0.8;break;default:grade=1;break;var total=parseFloat(num)*parseFloat(price)*grade;document.calform.totalprice.value=total;alert(您享受了+grade*10+折优惠!);招行支付 打9折 现金支付 打8折 其他 打10折,不打折循环循环 vforfor循环循环vdo-whiledo-whilevwhile while q for循环例:var i;for(i=0;i10;i+)/语句;FOR FOR 循环循环For 循环演示document.write(打印金字塔直线);for(var i=0;i100;i=i+5)document.write();FOR FOR 循环循环如何实现当i=5 时,qwhile循环 while(循环条件)/语句;qdowhile循环 do /语句;while(循环条件);WHILEWHILE和和DODOWHILEWHILE循环循环先执行,后判断循环条件先执行,后判断循环条件 .myfont font-size:150;color:#c99c96;font-family:Webdings /产生埃及图像的特殊字体产生埃及图像的特殊字体 document.write(每个字符都对应一个漂亮的埃及图像每个字符都对应一个漂亮的埃及图像);do var c=prompt(输入一个字符,输入输入一个字符,输入N 或或n停止停止,A);document.write(+c+);while(c!=N&c!=n);WHILEWHILE和和DODOWHILEWHILE循环循环输入一个字符,直到N停止,用哪个循环JAVASCRIPT JAVASCRIPT 函数函数内置函数内置函数 vevaleval 函数:函数:用于计算字符串表达式的值用于计算字符串表达式的值 visNaNisNaN 函数:用于验证参数是否为函数:用于验证参数是否为 NaNNaN(非(非数字)数字)var str1=prompt(“输入一个表达式,我给您计算,1+1);var result=eval(str1);document.write(str1+=+result);var x=prompt(输入一些数据,0);if(isNaN(x)alert(x+不是一个数字);else alert(x+是一个数字);自定义函数自定义函数v定义函数:定义函数:functionfunction 函数名函数名(参数参数1,1,参数参数2 2,)语句语句;v调用函数:调用函数:函数调用一般和表单元素的事件一起使用,调用函数调用一般和表单元素的事件一起使用,调用格式为:事件名格式为:事件名“函数名函数名”;function sum(one,two)var result=one+two;return result;表示单击此按钮时,调用函数sum()执行函数的应用函数的应用 num1num2result定义函数定义函数 JavaScript 代码 function compute(op)var num1,num2;num1=parseFloat(document.myform.num1.value);num2=parseFloat(document.myform.num2.value);if(op=+)document.myform.result.value=num1+num2 ;if(op=-)document.myform.result.value=num1-num2 ;if(op=*)document.myform.result.value=num1*num2 ;if(op=/&num2!=0)document.myform.result.value=num1/num2 ;定义函数compute(),完成计算的功能。op参数代表运算符号 调用函数调用函数 第一个数 第二个数 计算结果