首页 > 编程语言 > 详细

javascript正则表达式对象、窗体对象11.0

时间:2020-08-16 16:30:37      阅读:71      评论:0      收藏:0      [点我收藏+]

12、正则表达式对象

定义:正则表达式是规则,是让计算机能够读懂的人类制定的规则

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";                                           
}                                                                       

13、窗体对象

提示框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";
    }
}

 

javascript正则表达式对象、窗体对象11.0

原文:https://www.cnblogs.com/HelloM/p/13512793.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!