JS之正则表达式

1、正则表达式的创建方式：


方式1：
　　　　/正则表达式/模式

方式2：
　　　　new RegExp("正则表达式",模式);

正则表达式对象常用的方法：
　　　　test() 使用正则对象去匹配字符串 如果匹配成功返回ture，否则返回false.
　　　　exec() 根据正则表达式去查找字符串符合规则的内容。

模式：
　　g （全文查找出现的所有 pattern）
　　i （忽略大小写）

    var str = "hello123";
    var reg = /^[A-Z0-9]+$/i;//检查一个字符串一定要加上^和$，表示字符串的开始和结束，否则就会发生只要字符串中有符合要求的就是True
    alert("匹配吗？"+reg.test(str));

 

    var str  ="da jia hao hao xue xi a";
    var reg = /\b[a-z]{3}\b/gi;       //一定要加上g这个模式，不然会发生从da 又回到da的现象  \b表示是一个单词的
    var line ="";
    while((line = reg.exec(str))!=null){
        document.write(line+"<br/>")
    }

 2、正则表达式的应用

 

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<script type="text/javascript">
 function checkName(){
     var userNode = document.getElementById("userName");
     var spanUserNode = document.getElementById("userId");
     var userName = userNode.value;
     //alert(userName);
     var reg=/^[a-z][a-z0-9]{5}$/i;
     if(reg.test(userName)){
         spanUserNode.innerHTML = "正确".fontcolor("green");
         return true;

     }else{
         spanUserNode.innerHTML = "错误".fontcolor("red");
         return false;
     }
 }
 function checkEmail(){
     var emailNode=document.getElementById("email");
     var spanEmailNode = document.getElementById("emilId");
     var emailName = emailNode.value;
     var reg=/^[a-z0-9]\w+@[a-z0-9]+(\.[a-z]{2,3}){1,2}$/i;
     if(reg.test(emailName)){
         spanEmailNode.innerHTML = "正确".fontcolor("green");
         return true;

     }else{
         spanEmailNode.innerHTML = "错误".fontcolor("red");
         return false;

     }
 }
    function checkAll(){
        if(checkName()&&checkName()){
            return true
        }else{
            return false;
        }
    }
</script>
<body>

/*
表单提交的时候是会触发onsubmit事件的，如果onsubmit事件的方法返回是true，那么该表单允许提交，如果返回的是false，该表单不允许提交。

*/

<form action="success.html" method="post" onSubmit="return checkAll()">
    <table border="1px" width="50%" align="center" cellspacing="0px" cellpadding="3px">
    <tr>
        <td width="25%">姓名：</td>
        <td>
            <input type="text" id="userName" onBlur="checkName()"/> //点击光标时触发
            <span id="userId"></span>
        </td>
    </tr>
    <tr>
        <td width="25%">邮箱：</td>
        <td>
            <input type="text" id="email" onBlur="checkEmail()"/>
            <span id="emilId"></span>
        </td>
    </tr>
    <tr>
        <td colspan="2" align="center">
            <input type="submit" value="登录" />
        </td>
    </tr>
    </table>
</form>
</body>
</html>

 

posted @ 2017-02-27 18:17  mslog  阅读(213)  评论(0)  编辑  收藏  举报