資料結構
網路
關係型資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝學
法學如何使用 JavaScript 獲取文件中表單的數量？
在本教程中，我們將學習如何使用 JavaScript 獲取文件中表單的數量。由於在 HTML 文件中建立表單的方法不同，因此獲取現有表單的數量可能會比較棘手。但是，您可以使用一些方法來計算沒有使用 form 標籤建立的表單。
使用 length 屬性
在 HTML 文件中建立表單最廣泛接受的方法是使用 <form> 標籤。一些網站也使用 <div> 標籤在文件中建立表單。因此，我們將討論從 <form> 和 <div> 標籤獲取表單數量的方法。
語法
使用以下語法，我們可以使用 <form> 標籤獲取 HTML 文件中表單的數量。
document.forms.length
演算法
步驟 1 − 使用 <form> 標籤在 HTML 文件中建立一個表單。
步驟 2 − 建立一個變數來獲取表單的數量。
步驟 3 − 使用 document.forms.length 獲取表單的數量。
步驟 4 − 使用 innerHTML 屬性顯示錶單的數量。
示例 1
在這個例子中，我們建立了一個表單來檢查 document.forms.length 如何確定實際的表單數量。您可以試驗程式碼並增加表單數量以檢視輸出。
<html> <body> <form> <input type="text"> <input type="submit"> </form> <p id=numform></p> <script> let forms = document.forms.length; document.getElementById('numform').innerHTML = "Number of forms: " + forms; </script> </body> </html>
使用 querySelectorAll() 獲取文件中表單的數量
由於可以使用 <div> 在網站中建立表單，因此您可以使用 querySelectorAll() 方法獲取表單的數量。在 querySelectorAll() 中，您必須提及型別、類、ID 和名稱，這些名稱可能包含“form”一詞。
語法
使用以下語法，您可以獲取文件中沒有使用標籤建立的表單的數量。
var forms = document.querySelectorAll("[type='form'],[name ='form'],[id='form']");
for(var i = 0; i < forms.length; i++);
x.innerHTML = forms.length;
演算法
步驟1 − 建立兩個表單，一個使用 <div> 標籤，另一個使用 <form> 標籤。
步驟 2 − 對於第一個 div，編寫 type = 'form'，對於第二個 div，編寫 id = 'form'。
步驟 3 − 在 JavaScript 中，使用 querySelectorAll() 方法透過標籤和 ID 名稱獲取兩個 <div> 標籤。
步驟 4 − 使用自增運算子和 .length 方法獲取使用 <form> 標籤建立的多個表單。
示例
在下面的示例中，我們獲取了沒有使用標籤建立的表單的數量，並將其與使用 <form> 標籤建立的表單數量相加。
<html> <body> <h4>Using <i>querySelectorAll()</i> to get the number of forms</h4> <div type="form"> <input type="text"> <input type="submit"> </div> <form> <input type="text"> <input type="submit"> </form> <p id="numform"></p> <script> var elms = document.querySelectorAll("[type='form']"); for (var i = 0; i < elms.length; i++); let x = elms.length; let forms = document.forms.length + x; document.getElementById('numform').innerHTML = "Number of forms: " + forms; </script> </body> </html>
雖然 document.forms.length 方法通常用於獲取文件中存在的表單數量，但要找出實際存在的表單數量，應使用 querySelectorAll() 方法。可能還有其他方法可以獲取文件中建立的表單數量。上面提到的方法是最可靠的。
995 次瀏覽
