JavaScript 基础回顾
常量（字面量）
比如：100，“abc”
alert（123）//整数常量；alert：弹出一个（123）的提示信息
alert("123")//字符串常量
alert（"3.14"）//小数常量
alert（"javascript"）；//字符串常量
var name；//name是空间名称
字符串
变量（一块存储空间）
var name =“名字”；//name是空间名称
var是关键字，是变量的意思
变量名（空间的名称） 房间号（8301）
变量值（空间里面的数据）（房客）
变量类型（）
使用js定义变量的语法格式是：
var 变量名；//声明
var 变量名 = 值；//声明的同时进行初始化
数据类型
比如：字符串、数值（整数）（小数）、布尔
布尔类型的值有两个；true，false
var israin = true；//今天下雨了。
var israin = false；//今天没下雨。
算术运算符: +,-,*,/,%
逻辑运算符（逻辑运算的结果是布尔类型）
逻辑或：||
语法格式：表达式||表达式
只要有一个表达式的结果是ture，那么逻辑与运算的结果就是ture，
两个表达式的结果都是flase，那么逻辑与运算的结果就是flase
逻辑与：&&
语法格式：表达式&&表达式
只要有一个表达式的结果是false，name逻辑与运算的结果就是false，
两个表达式的结果都是true，那么逻辑与运算的结果就是true
逻辑非：！
语法格式：！表达式
逻辑异或：^
语法格式：表达式^表达式
比较运算符（比较运算的结果是布尔类型）
(>) 左边是否比右边大
(< ) 左边是否比右边小
(>= )左边是否大于等于右边
(<= )左边是否小于等于右边
( == ) 比较左边和右边是否相等
if else 结构
示例如下：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
//统计点击次数
var times = 0;
function show () {
times++;//times = times + 1;
if(times == 1){
document.getElementById("again").innerText="再点一次";
}
else if(times == 2){
document.getElementById("again1").innerText="要不要再点一次？";
}
else if (times == 3) {
document.getElementById("again2").innerText="你需要再点一次";
}
else if(times == 4){
document.getElementById("again3").innerText="你那么想看吗？";
}
else if(times == 5){
document.getElementById("again4").innerText="再见";
document.getElementById("again1").innerText="";
document.getElementById("again2").innerText="";
document.getElementById("again3").innerText="";
document.getElementById("again").innerText="";
}
else if(times == 6){
document.getElementById("div001").style.display="none";
}
else{
alert(times);
}
}
</script>
</head>
<body>
<div id="div001" onclick="show();"
style="width:300px;height: 300px;background-color: green;">
<h3 id="again4" style="color: white;">点击一下</h3>
<h3 id="again" style="color: white;"></h3>
<h3 id="again1" style="color: white;"></h3>
<h3 id="again2" style="color: white;"></h3>
<h3 id="again3" style="color: white;"></h3>
</div>
</body>
</html>
switch case 结构
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
//统计点击次数
var times = 0;
function show () {
times++;//times = times + 1;
switch (times){
case 1:
document.getElementById("again").innerText="请再次点击这里";
break;
case 2:
document.getElementById("third").innerText="你再点一次看看";
break;
case 3:
document.getElementById("first").innerText="谢谢";
document.getElementById("again").innerText="";
document.getElementById("third").innerText="";
break;
case 4:
document.getElementById("first").innerText="再见";
break;
case 5:
var childnode = document.getElementById("div001");
document.getElementById("main").removeChild(childnode);
//document.getElementById("div001").style.display="none";
break;
default:
alert(times);
break;
}
}
</script>
</head>
<body id="main">
<div id="div001"
style="width:30%;height:200px;background-color: green;"
onclick="show();">
<h1 id="first" style="color: white;">点击这里</h1>
<h1 id="again" style="color: white;"></h1>
<h1 id="third" style="color: white;"></h1>
</div>
</body>
</html>
函数
isNaN(n) 检查n是不是一个非数值
比如：
var X = "hello";
var Y = "123";//y这个空间是字符串类型
var Z = 123；
var flag = isNaN（"X"）；//ture
var flag2= isNaN("Y");//flase
var flag3= isNaN（"Z"）;//flase
示例如下：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
function checkamount(money){
//var x = parseInt(money);
if(isNaN(money)==true){
document.getElementById("amount_error").innerText="*金额必须是数值"
return false;
}else{
document.getElementById("amount_error").innerText="";
}
}
</script>
</head>
<body>
<h1>这是一个标签</h1>
请输入金额：
<input type="text" name="amount" id="amount" value="0.00" onblur="checkamount(this.value)" />
<span id="amount_error"></span>
</body>
</html>
正则表达式：
基本的正则表达式：
[0-9] 表示0-9之间的一个数字
[0-9]{3} 表示3位数字
[0-9]+ 表示一个数字或者一个以上的数字
[0-9]* 表示0个数字或者多个数字
[0-9]{5,11}表示5-11位的数字
[0-9]？ 表示0个或1个数字
[a-zA-Z] 表示a-z的一个字母
[a-zA-Z0-9] 表示一个单词字符（可以是英文字母、数字、下划线）
\d 表示一个数字，等价于[0-9]
\w 表示一个单词字符，等价于[a-zA-Z]
今日练习
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript">
function checkgm(gm){
var reg = /^(?=.*[0-9])(?=.*[a-zA-Z])(.{1,10})$/
if(reg.test(gm)==true){
document.getElementById("gm_error").innerText="√";
}else{
document.getElementById("gm_error").innerText="*10位长度以内的数字，字母组合";
}
}
function checktel(tel){
var one = /^0\d{2,3}-?\d{7,8}$/;
if(one.test(tel)==true){
document.getElementById("tel_error").innerText="√";
}else{
document.getElementById("tel_error").innerText="*形如：021-12345678";
}
}
</script>
</head>
<body>
管理员账号：
<input type="text" name="gm" id="gm" value="" onblur="checkgm(this.value)"/>
<span id="gm_error" style="color: red;font-size: 12px;"></span><br /><br />
电话号码：
<input type="text" name="tel" id="tel" value="" onblur="checktel(this.value)"/>
<span id="tel_error" style="color: red;font-size: 12px";> </span> <br />
<input type="submit" name="sbt" id="sbt" value="保存" />
</body>
</html>
网友评论