Javascript 正確地引用表單和表單元素

所有的 html 表單都應該有一個 name 屬性。對於 XHTML 文件來說，name 屬性是不被要求的，但 Form 標籤中應有相應有 id 屬性，並必須用 document.getElementById() 來引用。使用像 document.forms[0] 這樣的索引方法來引用表單，在幾乎所有情況下，是一個糟糕的做法。有些瀏覽器把文件中使用 form 來命名的元素當作一個可用的 form 屬性。這樣並不可靠，不應該使用。

下面這個例子用使用方括號和正確的物件引用方法來展示如何防止錯誤地引用一個表單的input：

正確引用表單 Input：

document.forms["formname"].elements["inputname"]

糟糕的做法:

document.formname.inputname

如果你要引用一個函式裡的兩個表單元素，較好的做法是先引用這個form物件，並將其儲存在變數中。這樣避免了重複查詢以解決表單的引用：

var formElements = document.forms["mainForm"].elements;
formElements["input1"].value="a";
formElements["input2"].value="b";

當你使用 onChange 或者其他類似的事件處理方法，一個好的做法是總是通過一個引來把 input 元素本身引用到函式中來。所有 input 元素都帶有一個對包含其在內的Form表單有一個引用：

<input type="text" name="address" onChange="validate(this)">

function validate(input_obj) {
   // 引用包含這個元素的form
   var theform = input_obj.form;
   // 現在你可以不需要使用硬程式碼來引用表單自身
   if (theform.elements["city"].value=="") {
      alert("Error");
   }
}

通過對錶單元素的引用來訪問表單的屬性，你可以寫一個不包含硬程式碼的函式來引用這個頁面中任何一個有特定名的表單。這是一個非常好的做法，因為函式變得可重用。