全域form變數的取得

在寫網頁全域 javascript 的部分, 由於 ie 可以很容易的解析全域型變數, 也造成有些網站在實作 client javascript 時, 會發生一些問題.

基本上在網頁上存取頁面元件時, 可以利用 DOM 的方式進行, 以免發生跨瀏覽器的問題, 以下為一些常見的狀況. 例如頁面上有個唯一的 form, name為 f1 時, 通常會有人這麼寫:

f1.submit();

這在 ie 下可以, 但在其他的瀏覽器可能不支援, 不過也不能怪它, 因為這個本來就是有問題的寫法, 理論上寫法應該只有兩種, 就是全域的 id 及 DOM, 方式如下:

1. document.getElementById(‘form_id’).submit();
2. document.forms[‘form_name’].submit();
3. document.forms[index].submit();

這幾種方式才是正確而理想的寫法, 所以不要再簡化到讓瀏覽器不能工作囉.

另外關於 form 內 element 的取法也一樣, 利用全域 id 或 DOM 也都可以實作出來, 例如:

1. document.forms[‘f3’].elements[‘t1’].value
2. document.forms[3].elements[0].value
3. document.getElementById(‘t1’).value

其中比較有趣的是有關重覆 id 的部分, 由於 getElementById 就只認定一個 id, 所以重覆的部分就不會再被取出, 有趣的是可以對照著 getElementsByTagName 的話, 就是依 tag name 將所有的元素一起取出, 以陣列的方式傳回, 如此便一個一個取回囉.

範例如下:
javascript 取元素:
http://sample.diary.tw/5/javascript.php
getElementById 及 getElementsByTagName 比較:
http://sample.diary.tw/5/multiid.php

參考資料:
http://blog.nahoya.com/archives/2005_10/47
http://blog.blueshop.com.tw/abgne/archive/2006/04/10.aspx

isArray function 是從
http://www.mattkruse.com/javascript/validations/source.html
這邊來的, 在此附上原出處, 內容是利用是否有 length 屬性來判讀, 相當實用!