首页 > 代码库 > 【JS学习】JS基础2
【JS学习】JS基础2
一、运算符
(1)算术:+加、-减、*乘、/除、%取余
实例:隔行变色、秒转时间
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>隔行变色</title>
<script>
window.onload = function ()
{
var aLi=document.getElementsByTagName(‘li‘);
for(var i=0;i<aLi.length;i++)
{
if(i%2==0)
{
aLi[i].style.background=‘#CCC‘;
}
else
{
aLi[i].style.background=‘‘;
}
}
};
</script>
</head>
<body>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>秒转时间</title>
<script>
var s=156;
alert(parseInt(s/60)+‘分‘+s%60+‘秒‘);
</script>
</head>
<body>
</body>
</html>
(2)赋值:=、+=、-=、*=、/=、%=
比如
i=i+1;
i++;
i+=1;
i=i+3;
i+=3;
(3)关系:<、>、<=、>=、==、===、!=(不等)、!==
(4)逻辑:&&与,||或,!否
实例:全选与反选
(5)运算优先级:括号
二、程序流程控制
(1)判断:if,switch,?:
switch语法:
switch(变量)
{
case 值1:
语句1;
break;
case 值2:
语句2;
break;
......
default:
语句n;
}
?:语法——三元运算符/三目运算符
在if语法中
if(条件)
{
语句1;
}else
{
语句2;
}
相当于在?:语法中
条件?语句1:语句2
(2)循环:while,for
(3)跳出:break,continue
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>break和continue</title>
<script>
for(i=0;i<5;i++)
{
if(i==2)
{
break;//循环中断
}
alert(i);
}
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>break和continue</title>
<script>
for(i=0;i<5;i++)
{
if(i==2)
{
//break;//循环中断
continue;//只是中断本次循环
}
alert(i);
}
</script>
</head>
<body>
</body>
</html>
三、什么是真什么是假
真:true、非零数字、非空字符串、非空对象(比如document,数组)
假:false、数字零、空字符串、空对象(null)、undefined
四、Json
什么是Json:基于JavaScript的一个子集。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Json</title>
<script>
/*var a=12;
var b=5;
var c=‘abc‘;*/
var json={a:12, b:5, c:‘abc‘};
//alert(json.a);
json.b++;
alert(json.b);
</script>
</head>
<body>
</body>
</html>
(2)json和数组
循环:一般情况下数组用从0-length的循环语句
遇到json用for in
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>json和数组</title>
<script>
var json={a:12, b:5, c:7};
var arr=[12,5,7];
//alert(json.a);
//alert(json[‘a‘]);//jons的下标是字符串
//alert(arr[0]);//数组的下标是数字
//alert(arr.length);//输出3
//alert(json.length);//输出undefined,json没有length
//循环
/*for(var i=0;i<arr.length;i++)
{
alert(‘第‘+i+‘个元素:‘+arr[i]);
}*/
/*for(var i in arr)
{
alert(‘第‘+i+‘个元素:‘+arr[i]);
}*/
for(var i in json)
{
alert(‘第‘+i+‘个元素:‘+json[i]);
}
</script>
</head>
<body>
</body>
</html>
【JS学习】JS基础2