首頁 > web前端 > js教程 > 如何使用 JavaScript 檢索文字輸入欄位的值?

如何使用 JavaScript 檢索文字輸入欄位的值?

Susan Sarandon
發布: 2024-12-22 17:12:22
原創
1012 人瀏覽過

How to Retrieve the Value of a Text Input Field Using JavaScript?

如何使用JavaScript 取得文字輸入欄位的值

您可以使用下列方法取得JavaScript 中文字輸入欄位的值:

方法一: getElementById

document.getElementById('input_id').value;
登入後複製

方法二: getElementsByClassName

document.getElementsByClassName('class_name')[0].value;
登入後複製

方法 3:getElementsByTagName

document.getElementsByTagName('input')[0].value;
登入後複製

方法 4:getElementsByName

document.getElementsByName('input_name')[0].value;
登入後複製

方法 4:getElementsByName

方法5:querySelector

document.querySelector('#input_id').value;
登入後複製
透過ID:

document.querySelector('.class_name').value;
登入後複製
按類別:

依分類:
document.querySelector('input').value;
登入後複製

名稱:

方法六:querySelectorAll

document.querySelectorAll('#input_id')[0].value;
登入後複製
類似querySelector,但回傳靜態NodeList:

依ID:

document.querySelectorAll('.class_name')[0].value;
登入後複製

🎜>

document.querySelectorAll('input')[0].value;
登入後複製

依標籤名稱:

const searchTxtValue = document.getElementById('searchTxt').value;
登入後複製

程式碼中的範例

Browser Method 1 Method 2 Method 3 Method 4 Method 5/6
IE6 Y (Buggy) N Y Y (Buggy) N
IE7 Y (Buggy) N Y Y (Buggy) N
IE8 Y N Y Y (Buggy) Y
IE9 Y Y Y Y (Buggy) Y
IE10 Y Y Y Y Y
FF3.0 Y Y Y Y N
FF3.5/FF3.6 Y Y Y Y Y
FF4b1 Y Y Y Y Y
GC4/GC5 Y Y Y Y Y
Safari4/Safari5 Y Y Y Y Y
Opera10.10/
Opera10.53/ Y Y Y Y (Buggy) Y
Opera10.60
Opera 12 Y Y Y Y Y
要取得程式碼中搜尋文字輸入欄位的值,請使用:瀏覽器支援

以上是如何使用 JavaScript 檢索文字輸入欄位的值?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板