JavaScript day-02
//demo1
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script>
//2.Number
var n = 3.1415926;
console.log(n.toFixed(3));//显示小数位
//4.Array(js中的数组都是Object数组)
//4.1如何创建数组
//1)若创建数组时就已知数据
var a1 = ["zhangsan",25,true];
console.log(a1[0]);
//2)若创建数组时不知道要存什么数据,
//就创建一个空数组.
var a2 = new Array();
//后面知道要存什么数据时，追加数据
a2.push("lisi");
a2.push(28);
a2.push(true);
console.log(a2[0]);
//4.2数组倒转
var arr = [5,12,5,878,64,7];
arr.reverse();
console.log(arr);
//4.3数组排序
//1)数组默认按照字符串由小到大排序
//2)可以通过替换比较方法来改变排序
//结果,在js里方法也是对象,可以作参数,
//由于该方法不需要复用,所以一般写成
//匿名函数.
arr.sort(function(a,b){return a-b;});
console.log(arr);
//5.Math
console.log(Math.PI);
console.log(Math.round(4.56));
//6.Date
//1)创建客户机的当前时间
var d1 = new Date();
console.log(d1)
//2)创建指定的时间(一般来源于服务器)
var d2 = new Date("2016/12/12 12:12:12");
console.log(d2);
//3)转换为本地日期/时间格式的字符串
console.log(d1.toLocaleDateString());
console.log(d1.toLocaleTimeString());
//4)读写时间分量(某一个部位的值)
//读:getXXX() 写:setXXX()
var y = d1.getFullYear();
//月份从0开始
var m = d1.getMonth();
var d = d1.getDate();
var today = y+"年"+(m+1)+"月"+d+"日";
console.log(today);
//7.RegExp
var str = "you can you up,no can no bb.";
//7.1创建正则对象
var reg = /no/;
//7.2正则对象的方法
//1)reg.exec(str)
//普通模式:从str中找出与reg匹配的
//第一个子串.
console.log(reg.exec(str));
//全局模式:第n次调用则从str中找出
//与reg匹配的第n个字串.
reg = /no/g;
console.log(reg.exec(str));
console.log(reg.exec(str));
console.log(reg.exec(str));
console.log(reg.exec(str));
//2)reg.test(str)
//判断str中是否包含与reg匹配的字符串
console.log(reg.test(str));
//7.3字符串支持正则的方法
//1)replace
console.log(str.replace(reg,"bu"));
//字符串是不可变的(final),修改字符串的方法,
//并没有改变原字符串 ,而是生成了新字符串.
console.log(str);
//2)match
console.log(str.match(reg));
//3)search
console.log(str.search(reg));
//8.Function
//通过function关键字所声明的
//是一个函数(Function)对象.
//浏览器加载网页到此处时，并没有
//调用此对象，仅仅是创建了对象而已.
function sum(){
var s = 0;
if(arguments.length>0){
for (var i = 0; i < arguments.length; i++) {
s += arguments[i];
}
}
return s;
}
//一般是在点击按钮时调用函数对象,
//也可以在页面加载时直接调用它.
console.log(sum(1,2,3));
console.log(sum(4,5,6,7,8));
//结论,js的函数没有重载.但可以
//实现和重载一样的调用方式.
</script>
</head>
<body>
</body>
</html>
//demo2
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <style type="text/css"> .ok{ color:green; } .error{ color:red; } </style> <script> //验证账号的格式 function checkCode(){ //alert(1); //获取账号 var code = document.getElementById("code").value; //获取span var span = document.getElementById("code_msg"); //判断账号格式 var reg = /^\w{5,10}$/;//^表示开头 $表示结尾 \w表示字母 这句话表示:从开始到结尾出现5-10次 if(reg.test(code)){ //格式对了 变绿 span.className = "ok"; return true; }else { //格式错了 变红 span.className = "error"; return false; } } </script> <script> function checkPass(){ //alert(1); //获取账号 var code = document.getElementById("pwd").value; //获取span var span = document.getElementById("pwd_msg"); //判断账号格式 var reg = /^\w{5,10}$/;//^表示开头 $表示结尾 \w表示字母 这句话表示:从开始到结尾出现5-10次 if(reg.test(code)){ //格式对了 变绿 span.className = "ok"; return true; }else { //格式错了 变红 span.className = "error"; return false; } } </script> </head> <body> <form action="<!-- http://www.tmooc.cn -->#" onsubmit="return checkCode()+checkPass()==2;"> <p> 账号:<input type="text" id="code" onblur="checkCode();"/> <span id="code_msg">5-10位字母、数字、下划线</span> </p> <p> 密码:<input type="password" id="pwd" onblur="checkPass();"/> <span id="pwd_msg">10-20位字母、数字、下划线</span> </p> <p> 账号:<input type="submit" value="登陆"/> </p> </form> </body> </html>
//demo3
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script> function cal(){ //获取文本框 var input = document.getElementById("num"); //获取框中的值 var num = input.value; //开始计算 //在使用evil时,建议在字符串前后 //加上括号,可以避免一些奇怪的问题. try{ var value = eval("("+num+")"); input.value = value; }catch (e) { input.value = "Error"; } } </script> </head> <body> <input type="text" id="num"/> <input type="button" value="=" onclick="cal();"/> </body> </html>
浙公网安备 33010602011771号