第一次在自己的项目说写正则表达式的心得

1.封装的使用

2.innerHtml获取不到input的值，应为没有文本节点

3.获得光标事件.onfocus

4.test()正则表达式的专用方法

var ZH = document.querySelector(".yy .enter .enter-center .ZH input");
var MM = document.querySelector(".yy .enter .enter-center .MM input");
var DLbtn = document.querySelector(".enter-center .DLbtn");
//封装 由于需要多次获得多次文本框的值，所以定义函数$用于简化获得页面元素对象
function $(elementId){
    return document.getElementById(elementId);
}

DLbtn.onclick =function(){
    checkUser();
    checkPwd();
}
/*用户名验证*/
function checkUser(){
    console.log("aa");
    var ZHValue = ZH.value;
    //ZH.innerHTML = "";//innerHtml获取不到input的值

    console.log(ZHValue);
    //用户名是由英文字母和数字组成的4~16位字符，以字母开头
    var reg = /^[a-zA-Z][a-zA-Z0-9]{3,15}$/;
    //console.log(reg.test(ZHValue));  //test()方法是使用
    if(!reg.test(ZHValue)){
        //console.log("bbb");
        ZH.style.color = "red";
        ZH.value = "用户名不正确,重新输入";
        console.log(ZH.value);
        //console.log(ZH.innerHTML);
        return false;
        
    }
    return true;
}
/*密码验证*/
function checkPwd(){
    var pwd = MM.value;
    //密码油4-10个字符组成
    var reg = /^[0-9a-zA-Z]{4,10}$/
    if(reg.test(pwd) == false){
        MM.style.color = "red";
        MM.value = "密码不正确，重新输入";
        return false;
    }
    return true;
}
//在获得光标的时候去除显示错误的内容"密码不正确，重新输入",在设置回原来的字体颜色
ZH.onfocus = function(){
    this.value = "";
    this.style.color = "#000000";
}
MM.onfocus = function(){
    this.value = "";
    this.style.color = "#000000";
}