1. 复选框对象：
   
   
   • 格式：

   document.forms[索引].elements[索引].属性

   document.forms[索引].elements[索引].方法（参数）

   document.表单名称.单选对象名称[索引].属性

   document.表单名称.单选对象名称[索引].方法（参数）

   • 属性：

   checked	设置该对象为选定状态
   defaultChecked	对应该对象的默认选定状态
   form	该对象所在的表单
   name	该对象的name属性
   type	该对象的type属性
   value	该对象的value属性

   • 方法：

   blur()
   click()
   focus()
   handleEvent(事件)

   • 事件处理程序：

   onBlur onClick onDbClick onFocus onKeyDown onKeyPress onKeyUp
   onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove

   • 例：

   <Script>

   function count() {
   var checkCount=0;
   var num = document.form1.elements.length;
   
   for (var i=0; i<num; i++) {
   if (document.form1.elements[i].checked)
       checkCount++;
   }
   alert ("你喜欢 "+ checkCount + "种颜色。")
   }

   </Script>
   <FORM NAME=form1>
   请选择你喜欢的颜色：<BR>
   <INPUT TYPE="checkbox" NAME="red">红色
   <INPUT TYPE="checkbox" NAME="green">绿色
   <INPUT TYPE="checkbox" NAME="blue">蓝色<BR>
   <INPUT TYPE="button" VALUE="请单击" onClick=count()>
   </FORM>

2. 选择对象：
   
   
   • 属性：

   form	该对象所在的表单
   name	该对象的name属性
   length	选项的数目
   options	<option>标记
   selectedIndex	所选项目的索引值
   type	该对象的type属性

   • 方法：

   blur()
   focus()
   handleEvent(事件)

   • 事件处理程序：

   onBlur onClick onChange onFocus onKeyDown onKeyPress onKeyUp
   onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove
   

3. 选项对象：选择对象的子对象
   
   
   • 格式：

   <option value="值" selected>文字</option>

   new Option([文字[,值[,defaultSelected[,selected]]]])

   • 属性：

   selected	判断该选项是否被选取
   defaultSelected	指定该选项为默认选定状态
   index	所有选项所构成的数组索引值
   length	选项的数目
   text	该选项显示的文字
   value	所选项传到服务器的值

   • 例1：

   <Script>

   var url = new Array(3);
   url[0] = "http://www.yam.org.tw/";
   url[1] = "http://www.kimo.com/";
   url[2] = "http://chinese.yahoo.com/";
   
   function goto(form) {
   var i = form.menu.selectedIndex;
   if (i>0) {
   location = url[i-1];
   }
   }

   </Script>
   <FORM>
   <SELECT NAME="menu" onChange="goto(this.form)">
   <OPTION>你喜欢哪一个搜索引擎?
   <OPTION STYLE="color:red">◆蕃薯藤
   <OPTION STYLE="color:red">◇奇摩
   <OPTION STYLE="color:red">◆中文雅虎
   </SELECT>
   </FORM>

   • 例2：

   <Script>
   
   function getText() {
   sel = document.forms[0].weekday
   ans = sel.options[sel.selectedIndex].text
   return ans;
   }

   </Script>
   <FORM>请选择...
   <SELECT name=weekday>
   <OPTION VALUE="Monday">星期一
   <OPTION VALUE="Tuesday">星期二
   <OPTION VALUE="Wednesday">星期三
   <OPTION VALUE="Thursday">星期四
   <OPTION VALUE="Friday">星期五
   <OPTION VALUE="Saturday">星期六
   <OPTION VALUE="Sunday">星期日
   </SELECT><P>
   <INPUT TYPE="button" VALUE="取出选项的文字"
   onClick="alert(getText())">
   <INPUT TYPE="button" VALUE="取出选项的值"
   onClick="alert(this.form.weekday.value)"><BR>
   </FORM>

   • 例3：

   <FORM NAME="form1">
   你最喜欢哪一种水果?
   <INPUT TYPE="text" NAME="fruit">
   <A HREF="#" onClick="javascript:open('1.htm','','width=100')">
   查询</A>
   </FORM>

   <Script> /* -------- 1.htm -------- */
   
   function choice() {
   sel = document.forms[0].elements[0];
   document.form1.fruit.value =
   sel.options[sel.selectedIndex].text;
   self.close();
   }

   </Script>

   <FORM>
   <SELECT onChange="choice()">
   <OPTION>请选择
   <OPTION>西瓜
   <OPTION>香蕉
   </SELECT>
   </FORM>

   • 例4：

   <Script>

   function createOptions(){
   var option = new Option(document.form1.select1.value)
   document.form1.select2.options[2] = option;
   }
   
   </script>

   <form name="form1">
   <select name="select1" size="10">
   <option>可选择项目 <option>---------------
   <option value="香蕉">香蕉 <option value="葡萄">葡萄
   <option value="苹果">苹果 <option value="梨子">梨子
   </select>

   <input type="button" value="-->" onClick="createOptions()">
   <select name="select2" size="10">
   <option>选择项目 <option>---------------
   </select>
   </form>

   • 例5：

   <Script>

   function createOptions(){
   sel1 = document.form1.select1;
   sel2 = document.form1.select2;
   var num = sel1.selectedIndex;
   var option = new Option(sel1.options[num].text);
   sel2.options[2] = option;
   }
   
   </script>

   <form name="form1">
   <select name="select1" size="10">
   <option>可选择项目 <option>---------------
   <option value="香蕉">香蕉 <option value="葡萄">葡萄
   <option value="苹果">苹果 <option value="梨子">梨子
   </select>

   <input type="button" value="-->" onClick="createOptions()">
   <select name="select2" size="10">
   <option>选择项目 <option>---------------
   </select>
   </form>

   • 例6：

   <Script>

   function createOptions(){
   sel1 = document.form1.select1;
   sel2 = document.form1.select2;
   var num = sel1.selectedIndex;
   var option = new Option(sel1.options[num].text);
   var item = sel2.options.length;
   sel2.options[item] = option;
   }
   
   </script>

   <form name="form1">

   <select name="select1" size="10">
   <option>可选择项目 <option>---------------
   <option value="香蕉">香蕉 <option value="葡萄">葡萄
   <option value="苹果">苹果 <option value="梨子">梨子
   </select>

   <input type="button" value="-->" onClick="createOptions()">
   <select name="select2" size="10">
   <option>选择项目 <option>---------------
   </select>
   </form>

   • 例7：

   <Script>

   function createOptions(){
   
   sel1 = document.form1.select1;
   sel2 = document.form1.select2;
   var num = sel1.selectedIndex;
   if (num > 1) {
   var option = new Option(sel1.options[num].text);
   var item = sel2.options.length;
   sel2.options[item] = option;
   }
   sel1.selectedIndex = 10000;
   }

   function delOptions() {
   var num = document.form1.select2.selectedIndex;
   if (num>1)
   document.form1.select2.options[num] = null;
   else
   document.form1.select2.selectedIndex = 10000;
   }
   
   </script>
   <form name="form1">
   <select name="select1" size="10"
   onDblClick="createOptions()">
   <option>可选择项目 <option>---------------
   <option value="香蕉">香蕉 <option value="葡萄">葡萄
   <option value="苹果">苹果 <option value="梨子">梨子
   </select>
   <input type="button" value="选择" onClick="createOptions()">
   <select name="select2" size="10">
   <option>选择项目 <option>---------------
   </select>
   <input type="button" value="删除" onClick="delOptions()">
   </form>
   

4. 文本区域对象：
   
   
   • 属性：

   defaultValue	对应该对象的默认值
   form	该对象所在的表单
   name	该对象的name属性
   type	该对象的type属性
   value	该对象的value属性

   • 方法：

   blur()
   select()
   focus()
   handleEvent(事件)

   • 事件处理程序：

   onBlur onClick onChange onSelect onFocus onKeyDown onKeyPress onKeyUp
   onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove

   • 例1：

   <Script>

   function isTooLong(elm){
   if (elm.length > 50) {
       alert("留言内容太长，请修改后再发送....");
       return false;
   }
   }
   
   </script>

   <FORM onSubmit="return isTooLong(this.msg.value)">
   <TEXTAREA NAME="msg" COLS="30" ROWS="5" onFocus="this.value=''">
   欢迎留言，不过请长话短说....
   </textarea><BR>
   <INPUT TYPE="submit" VALUE="留言完毕">
   </FORM>

   • 例2：

   <STYLE>
   INPUT {background-color:'99FFFF';color:"red"}
   TEXTAREA {background-color:'99FFFF';color:"red"}
   </STYLE>
   <BODY BGCOLOR="99FFFF">
   <FORM METHOD="post" ENCTYPE="text/plain" ACTION="mailto:hwyang@iii.org.tw?subject=不错">
   <TABLE>
   <CAPTION>读者回函</CAPTION>
   <TR><TD>姓　　名：
   <TD><INPUT TYPE="text" NAME="userName">
   <TR><TD>电子邮件：
   <TD><INPUT TYPE="text" NAME="email">
   <TR><TD VALIGN="top">内　　容：
   <TD><TEXTAREA NAME="msg" ROWS="2" COLS="30">
   我非常喜欢你的书，加油!!!
   </TEXTAREA>
   <TR><TD COLSPAN="2" ALIGN="center">
   <INPUT TYPE="submit" VALUE="填好了">
   </TABLE>
   </FORM>
   </BODY>
   

5. 文件上传对象：
   
   
   • 属性：

   form	该对象所在的表单
   name	该对象的name属性
   type	该对象的type属性
   value	该对象的value属性

   • 方法：

   blur()
   select()
   focus()
   handleEvent(事件)

   • 事件处理程序：

   onBlur onClick onSelect onFocus onKeyDown onKeyPress onKeyUp
   onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove

• Cookie对象：

是 一种以文件（Cookie文件）的形式保存在客户端硬盘的Cookies文件夹中的用户数据信息（Cookie数据）。Cookie文件由所访问的Web 站点建立，以长久的保存客户端与Web站点间的会话数据，并且该Cookie数据只允许被所访问的Web站点进行读取。

• Cookie文件的格式：

NS：Cookie.txt
IE：用户名@域名.txt

• 写入Cookie：

格式：

document.cookie = " 关键字 = 值 [ ; expires = 有效日期 ] [;...]"

备注：

1. 有效日期格式：Wdy,DD-Mon-YY HH:MM:SS GMT
2. Wdy / Mon：英文星期 / 月份；
3. 还包含path、domain、secure属性；
4. 每个Web站点（domain）可建立20个Cookie数据；
5. 每个浏览器可存储300个Cookie数据，4k字节；
6. 客户有权禁止Cookie数据的写入。
   

例1：

<Script>

var today = new Date();
var expireDay = new Date();
var msPerMonth = 24*60*60*1000*31;
expireDay.setTime( today.getTime() + msPerMonth );

document.cookie = "name=Hubert;expires=" + expireDay.toGMTString();
document.write("已经将 Cookie 写入你的硬盘中了!<br>");
document.write("内容是：", document.cookie, "<br>");
document.write("这个 Cookie 的有效时间是：");
document.write(expireDay.toGMTString());

</Script>

例2：

<Script>

var today = new Date();
var expireDay = new Date();
var msPerMonth = 24*60*60*1000*31;
expireDay.setTime( today.getTime() + msPerMonth );

function setCookie(Key,value) {
document.cookie = Key + "=" + value + ";expires=" + expireDay.toGMTString();
}

setCookie("NAME","HUBERT");
document.write("累计的 Cookies 如下：<BR>");
document.write(document.cookie);

</Script>

• 读取Cookie：

格式：

document.cookie

例

<Script>

function getCookie(Key){
var search = Key + "=";
begin = document.cookie.indexOf(search);
if (begin != -1) {
    begin += search.length;
    end = document.cookie.indexOf(";",begin);
    if (end == -1) end = document.cookie.length;
    return document.cookie.substring(begin,end);
}
}

document.write("嗨！ ",getCookie("name"), " 欢迎光临..")

</Script>

• 删除Cookie：

格式：

document.cookie = " 关键字 = ; expires = 当前日期"

例：

<Script>

var today = new Date();

function delCookie(Key) {
document.cookie = Key + "=;expires=today.toGMTString";
}

document.write("现有的 Cookies 如下：<BR>");
document.write(document.cookie, "<BR>");
delCookie("name");
document.write("删除后的 Cookies 如下：<BR>");
document.write(document.cookie);

</Script>