v" />
1.运算符:1.加减乘除:通过JavaScript在页面中定义变量,再通过算术运算符计算变量的运行结果。
<title>运用JavaScript运算符</title><script type="text/javascript">var num1=120,num2 = 25; //定义两个变量document.write("120+25=" + (num1+num2)+"<br>"); //计算两个变量的和document.write("120-25="+(num1-num2)+"<br>"); //计算两个变量的差document.write("120*25="+(num1*num2)+"<br>"); //计算两个变量的积document.write("120/25="+(num1/num2)+"<br>"); //计算两个变量的余数document.write("(120++)="+(num1++)+"<br>"); //自增运算document.write("++120="+(++num1)+"<br>");</script></head><body></body></html>运行上面代码观察输出结果。
2.比较运算符应用比较运算符计算实现两个数值之间的大小比较。
<script>var age = 25; //定义变量document.write("age变量的值为:"+age+"<br>"); //输出变量值document.write("age>=20:"+(age>=20)+"<br>"); //实现变量值比较document.write("age<20:"+(age<20)+"<br>");document.write("age!=20:"+(age!=20)+"<br>");document.write("age>20:"+(age>20)+"<br>");</script>运行上面代码,观察输出结果。
3.字符运算符例如,在网页中弹出一个提示对话框,显示进行字符串运算后变量的值,代码如下:var a="One "+"world "; //将两个字符串连接后的值赋值给变量aa+="One Dream" //连接两个字符串,并将结果赋给第一个字符串alert(a);运行上面代码,观察输出结果。
4.运用逻辑运算符比较表达式的值。
<title>逻辑运算符使用实例</title><script>var age = 27; //定义变量document.write("age = "+age +"<br>"); //输出变量的值document.write("age > 30 && age<40 :"+(age > 30 && age<40) +"<br>");//运用逻辑与运算符document.write("age > 30 || age<40 :"+(age > 30 || age<40) +"<br>");//运用逻辑或运算符document.write("!age > 30 "+(!age > 30)); //运用逻辑非运算符</script></head>2、提高练习——改变超级链接的背景色在一些网页中为了突出超级链接被选中时的状态,需要设置超级链接的背景颜色,以使超级链接更具有焦点性。
本实例实现了当鼠标移动到超级链接时,设置超级链接的背景颜色为红色。
开发步骤(1)当鼠标移动到超级链接时,显示超级链接的背景色,代码如下:<script language="javascript">function setbackcolor1(){yyy.style.backgroundColor="red";//设置一个样式名称,使它的style样式的backgroundColor属性#FF0000}</script>(2)当鼠标移出超级链接时,将超级链接背景色设置为白色,代码如下:<script language="javascript">function setbackcolor2(){yyy.style.backgroundColor="#FFFFFF";//设置一个样式名称(与上面的名称相同),使它的style样式的backgroundColor属性# FFFFFF}</script>(3)在页面中添加一个超级链接,并将onMouseMove和onMouseOut设置为JavaScript所定义的setbackcolor1()函数和setbackcolor2()函数,代码如下:<body vlink="#0066FF"><a name="样式名称" href=""onmouseover="setbackcolor1()"onmouseout="setbackcolor2();" style= "text- decoration:none; font-size: 18px; color: #FFFF00;"> 吉林省明日科技有限公司</a><p></body>实验结果或结论思考:1、JavaScript的基本数据类型有几种?答:基本数据类型有①数值数据类型(number)②布尔类型(boolean)③未定义数据类型(undefined)④空数据类型(null)引用数据类型有哪几种?答:引用数据类型有①字符串类型(string)②Array数组类型③对象类型(Object)如果要查看数据类型,使用什么方法?答:使用typeof方法可以查看数据类型定义变量的关键字是什么?答:var定义变量有几种方式?答:6种方式2.循环结构1、if条件判断语句if条件判断语句是最基本、最常用的流程控制语句,可以根据条件表达式的值执行相应的处理。
if语句的语法格式如下:if(expression){statement 1}else{statement 2}●expression:必选项,用于指定条件表达式,可以使用逻辑运算符。
●statement 1:用于指定要执行的语句序列。
当expression的值为true时,执行该语句序列。
●statement 2:用于指定要执行的语句序列。
当expression的值为false时,执行该语句序列。
练习1:判断用户是否输入用户名与密码。
(1)新建html页面,在页面中添加用户登录表单及表单元素。
具体代码如下:<form name="form1" method="post" action=""><table width="221" border="1" cellspacing="0" cellpadding="0" bordercolor="#FFFFFF" bordercolordark="#CCCCCC"bordercolorlight="#FFFFFF"><tr><td height="30" colspan="2" bgcolor="#eeeeee">·用户登录</td></tr><tr><td width="59" height="30">用户名:</td><td width="162"><input name="user" type="text" id="user"></td></tr><tr><td height="30">密 码:</td><td><input name="pwd" type="text" id="pwd"></td></tr><tr><td height="30" colspan="2" align="center"><input name="Button" type="button" class="btn_grey" value="登录" onClick="check()"> <input name="Submit2" type="reset" class="btn_grey" value="重置"></td></tr></table></form>(2)编写自定义的JavaScript函数check(),用于通过if语句验证登录信息是否为空。