JavaScript笔记之表单和正则表达式

正则表达式是一种对文本字符串进行验证和格式化的极其强大的方式。通过使用正则表达式，可以用一两行JavaScript代码完成原本需要几十行代码的复杂任务。
       正则表达式是一种特殊符号编写的模式，描述一个或多个文本字符串，常常被认为是编程中最棘手的部分之一，但是只要把混乱的正则表达式分解成有意义的小块，其语法并不难理解。
       下面的一个例子，是用正则表达式验证电子邮件地址：
[html]
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Email Validation</title>
    <link type="text/css" rel="stylesheet" href="script01.css" />
    <script type="text/javascript" src="script01.js"></script>
</head>
<body>
    <h2 align="center">Email Validation</h2>
    <form action="someAction.cgi">
        <p><label>Email Address:
        <input class="email" type="text" size="50" /></label></p>
        <p><input type="reset" /> <input type="submit" value="Submit" /></p>
    </form>
</body>
</html>

script01.css
[css]
body {
    color: #000;
    background-color: #FFF;
}

input.invalid {
    background-color: #FF9;
    border: 2px red inset;
}

label.invalid {
    color: #F00;
    font-weight: bold;
}

script01.js
[javascript]
window.onload = initForms;

function initForms() {
    for (var i=0; i< document.forms.length; i++) {
        document.forms[i].onsubmit = function() {return validForm();}
    }
}

function validForm() {
    var allGood = true;
    var allTags = document.getElementsByTagName("*");

    for (var i=0; i<allTags.length; i++) {
        if (!validTag(allTags[i])) {
            allGood = false;
        }
    }
    return allGood;

    function validTag(thisTag) {
        var outClass = "";
        var allClasses = thisTag.className.split(" ");

        for (var j=0; j<allClasses.length; j++) {
            outClass += validBasedOnClass(allClasses[j]) + " ";
        }

        thisTag.className = outClass;

        if (outClass.indexOf("invalid") > -1) {
            invalidLabel(thisTag.parentNode);
            thisTag.focus();
            if (thisTag.nodeName == "INPUT") {
                thisTag.select();
            }
            return false;
        }
        return true;

        function validBasedOnClass(thisClass) {
            var classBack = "";

            switch(thisClass) {
                case "":
                case "invalid":
                    break;
                case "email":
                    if (allGood && !validEmail(thisTag.value)) classBack = "invalid ";
                default:
                    classBack += thisClass;
            }
            return classBack;
        }

        function validEmail(email) {
            <span style="color:#ff0000;">var re = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;

</span>           return re.test(email);
        }

        function invalidLabel(parentTag) {
            if (parentTag.nodeName == "LABEL") {
                parentTag.className += " invalid";
            }
        }
    }
}

现在开始解释红色代码行：
      正则表达式总是以斜杠(/)开头和结尾。
      脱字符(^)表示要使用这个表达式检查以特定的字符串开头的字符串。
      表达式\w表示任意单一字符，包括a~z、A~Z、0~9或下划线。
      加号+表示要寻找前面条目的一次或多次出现。
      前圆括号(表示一个组。
      方括号[]用来表示可以

补充：web前端 , JavaScript ,