定义:正则表达式是规则,是让计算机能够读懂的人类制定的规则
var reg = /规则/;或者 var reg = new RegExp("规则");
正则:
g==>global全局
i==>ignore 忽略大小写
^==>标识 开始位置
$==>标识 结尾
量词:
*:任意次数,
+:至少一次,
?:0次或一次 ,
{n}:n次,n是一个正整数
{n,m}:至少n次,至多m次,n<m,n和m都是正整数
{n,}:至少n次,n是一个正整数
例:var str = "2a3,3A45,3A43,fad,3a4,342";
(1)、分隔
//以3为分界线
var arr = str.split("3");
//输出每一个被3分隔的字符串
for(var i=0; i<arr.length; i++) {
document.write(arr[i]);
document.write("<br>");
}
(2)、替换
//这里将,号替换成| 这里只替换匹配到的第一个
var s = str.replace(",", "|");
//返回新的字符串 12a3|3A45,3A43,fad,3a4,342
document.write(s);
document.write("<br>");
//这里将所有找到的a 不区分大小写 都换成|
var reg=new RegExp("a","gi")
var s1=str.replace(reg,"|");
//var s1=str.replace(/a/gi,"|"); //这个实现的功能相同
//12|3,3|45,3|43,f|d,3|4,342
document.write(s1)
document.write("<br>");
(3)、抓取对应的字符串
var str1="w34r384hugw949843hg37rdfhasi723hhiay29";
//这里匹配 小写子母 和大写子母
var numarr=str1.match(/[a-zA-Z]+/g);
//w,r,hugw,hg,rdfhasi,hhiay
document.write(numarr);
(4)、验证表达式对象,数据
var temp = "2372H";
//这里匹配的是纯数字
var r = /^\d+$/;
//bol返回的是布尔值 因为字符串中带有H 所以不是纯数字 因此返回false
var bol = r.test(temp);
alert(bol);
练习12-1:javascipt验证邮箱
HTML代码
js验证邮箱: <input type="text" id="input1" /> <input type="button" id="btn1" value="验证"/>
JavaScipt代码
//var btn=document.getElementById("btn1"); var btn =document.getElementById("input1"); btn.onblur=function(){ var obj=document.getElementById("input1"); //拿到输入框的值 var str=this.value; //创建正则表达式对象 var reg=new RegExp(); //对对象赋值 var reg = /^[a-zA-Z0-9]{6,11}@(sina\.cn|126\.com|163\.com|qq\.com)$/; //测试输入的字符串str是否符合正则表达式 if(reg.test(str)){ alert("通过"); } else{ this.style.border="1px solid red"; alert("输入有误"); } }; var dd=document.getElementById("input1"); //鼠标焦点事件 当鼠标焦点在框中就 dd.onfocus=function(){ this.style.border="none"; }
提示框confirm
//confirm("提示内容"); 返回Boolean,若点击“确定”,返回true,否则返回flase var f = window.confirm("今天下雨没?"); if(f) { alert("点击了确定"); }else { alert("点击了取消"); }
定时器
每隔一段时间执行的方法
语法: window.setInterval("执行的代码"/"函数名称","时间间隔【毫秒为单位】")
延迟执行
语法:window.setTimeout("可执行的代码"|"函数名","时间【毫秒】");
注意:定时器多次执行,延迟执行只执行一次。
练习13-1:按钮实现时间的暂停和开始
HMTL代码
<input type="button" id="btn1" value="按钮"/> <div id="div1"></div> <input type="button" id="btn2" value="暂停"/> <input type="button" id="btn3" value="开始"/>
JavaScript代码
//定义定时器对象 var inId = window.setInterval(timer, 1000); //定时器函数、 function time() { //定义日期对象 var date = new Date(); //拿到div块元素 var dd = document.getElementById("div1"); //输出日期字符串 dd.innerHTML = date.toString(); } //暂停按钮事件 var bt2 = document.getElementById("btn2"); bt2.onclick = function() { //清除定时器 里面要放入定时器对象 window调用定时器 window.clearInterval(inId); }; //开始按钮绑定事件 var bt3=document.getElementById("btn3"); bt3.onclick = function() { inId = window.setInterval(timer, 1000); };
练习13-2:时间倒数,自动跳转
HTML代码
<div id="div2">5秒以后,跳转至百度首页</div>
JavaScript代码
var timeobj=setInterval(fn2,1000); function fn2() { var d2 = document.getElementById("div2"); //取出div2中的内容 var h = d2.innerHTML; //取到内容中的数字 var n = parseInt(h); //对数字进行减一操作 n--; //div块中内容进行输出,这里是字符串进行拼接 substring 是从1开始向后所有进行截取 d2.innerHTML = n + h.substring(1); //当n=0时,结束定时器 if(n==0) { clearInterval(timeobj); //跳转到百度页面 window.location.href="http://www.baidu.com"; } }
原文:https://www.cnblogs.com/HelloM/p/13512793.html