html+css+js实现简单登陆注册界面

前辈们请跳过

 

前端入门学习第二天，对照W3C的文档写了简单的登录注册实现。

      html和css,js分别负责网页的界面、样式、动作。其中html提供的标签配合CSS实现界面美化的功能，CSS3中加入了新的样式，HTML5中也加入了更加方便的控件选择。例如本次页面中的输入框中提示就是用新加入的placeholder实现。谷歌、火狐等浏览器都可以正常解析。

login.html:

    
        
        
        
    
    
       

          Welcome to login
        

            
            
            

                

                    
                

                

                    

                        

                            用户名:
                            

                            

                        

                        

                            密   码:
                            

                            

                        

                        

                            验证码:
                            


                        

                        确认登录
                    

                    

没有账号？立即注册

                

            

    
        
    

login.js：

function chkname(){
    str=document.getElementById("username").value;
    if (!(/^\w+$/.test(str)) && str.length>0){
        document.getElementById("tip").innerHTML="*用户名须由字母数字下划线组成!";
        // document.write("用户名须由字母数字下划线组成");
    }else{
        document.getElementById("tip").innerHTML="";
    }
}
function chkpassword(){
    str=document.getElementById("password").value;
    if(str.length<8 && str){
        document.getElementById("tip2").innerHTML="*密码不可以少于八位!";
        
    }else{
        document.getElementById("tip2").innerHTML="";
    }
}
    
function chkcode(){
    str = document.getElementById("checkcode").value;
    if(!str){
        alert("请输入验证码!");
    }    
}