Form elements 集合

HTML DOM Form 對象

定義和用法

elements 集合返回表單中所有元素的集合。

注釋：集合中的元素按照它們在源代碼中出現的順序進行排序。

注釋：elements 集合返回 <form> 元素內的所有元素，而不是文檔中的所有 <form> 元素。如需獲取文檔中的所有 <form> 元素，請改用 document.forms 集合。

實例

例子 1

找出指定的 <form> 元素中有多少元素：

var x = document.getElementById("myForm").elements.length;

親自試一試

x 的結果將是：

3

提示：頁面下方提供更多實例。

語法

formObject.elements

屬性

屬性 描述
length

返回 <form> 元素中的元素數。

注釋：此屬性是只讀的。

方法

方法 描述
[index]

返回 <form> 中有指定索引的元素（從 0 開始）。

注釋：如果索引號超出范圍，則返回 null。
item(index)

返回 <form> 中有指定索引的元素（從 0 開始）。

注釋：如果索引號超出范圍，則返回 null。
namedItem(id)

返回 <form> 中有指定 id 的元素。

注釋：如果 id 不存在則返回 null。

技術細節

DOM 版本： Core Level 2 Document Object
返回值：

HTMLFormsControlCollection 對象，代表 <form> 元素中的所有元素。

集合中的元素按照它們在源代碼中出現的方式進行排序。

更多實例

例子 2：[index]

獲取表單中第一個元素（索引 0）的值：

var x = document.getElementById("myForm").elements[0].value;

親自試一試

x 的結果將是：

Donald

例子 3：item(index)

獲取表單中第一個元素（索引 0）的值：

var x = document.getElementById("myForm").elements.item(0).value;

親自試一試

x 的結果將是：

Donald

例子 4：namedItem(id)

獲取表單中 name="fname" 元素的值：

var x = document.getElementById("myForm").elements.namedItem("fname").value;

親自試一試

x 的結果將是：

Donald

例子 5

循環遍歷表單中的所有元素并輸出每個元素的值：

var x = document.getElementById("myForm");
var txt = "";
var i;
for (i = 0; i < x.length; i++) {
  txt = txt + x.elements[i].value + "<br>";
}
document.getElementById("demo").innerHTML = txt;

親自試一試

x 的結果將是：

Donald
Duck
Submit

瀏覽器支持

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
支持 支持 支持 支持 支持

HTML DOM Form 對象