1）获得表单

<form name="frm" id="form" method="post" action="">
</from>

语法格式

document.表单名 document.frm
或
document.getElementById(“id名”) document.getElementById(“frm”)

功能

document.getElementsByName(“表单name”); 通过表单名称获得表单
document.getElementById(“表单id”); 通过表单id获得表单

2）操纵表单元素

document.表单名.表单元素名.属性名
document.表单名.表单元素名.style.样式名
或
document.getElementById(“id名”).属性名
document.getElementById(“id名”).style.样式名

3）焦点事件

语法格式

<input type="" onfocus="函数()" onblur="函数()" />

onfocus事件：表单元素获得焦点时触发
onblur事件：表单元素失去焦点时触发

示例

 1、获得焦点
 function func1(){
     document.getElementById("userName").value = "";
 }
 document.getElementById("userName").value = "";  设置 id为userName 的表单元素的value为空

2、失去焦点
  function func2(){
       var userName = document.getElementById("userName").value;
         alert("姓名：" + userName);
      }
   var userName = document.getElementById("userName").value;  获得id为userName 的表单元素的value值

4）表单事件

语法格式

<input type="" onsubmit="return 函数()" onreset="函数()" />

onsubmit事件：表单提交时触发
onreset：表单重置时触发

5）表单验证

示例

1、登录名称验证

        var userName = document.getElementById("userName").value;
        if(userName == ""){
            alert("请输入登录名称！");
            return false;
        }

        var userName = document.getElementById("userName").value;  获取登录名称
        if(userName == "")  判断登录名称是否为空
        alert("请输入登录名称！");  提示填写登录名称
        return false;  返回false

    2、登录密码验证

         var passWord = document.getElementById("passWord").value;
         if(passWord == ""){
              alert("请输入登录密码！");
              return false;
         }

        var passWord = document.getElementById("passWord").value;  获取登录密码
        if(passWord == "")  判断登录密码是否为空
        alert("请输入登录密码！");  提示填写登录密码
        return false;  返回false