如何在 JavaScript 中获取输入文本字段的值？

在 JavaScript 中获取输入文本字段值

为了响应您的查询，有多种方法可用于直接检索输入文本字段的值，而无需使用表单。

方法一：使用getElementById()

document.getElementById('textbox_id').value 直接检索所需文本输入字段的值。

document.getElementById("searchTxt").value; // Get the value of the searchTxt text field

方法 2：使用getElementsByClassName()

document.getElementsByClassName('class_name')[whole_number].value 返回一个实时 HTMLCollection，可用于根据其类选择所需的文本字段。

document.getElementsByClassName("searchField")[0].value; // Get the value of the first text field with class "searchField"

方法三：使用getElementsByTagName()

document.getElementsByTagName('input')[whole_number].value 还会返回一个实时 HTMLCollection，并允许您根据其标签名称选择所需的文本字段。

document.getElementsByTagName("input")[0].value; // Get the value of the first text input field

方法四：使用getElementsByName()

document.getElementsByName('name')[whole_number].value 返回一个实时 NodeList，可用于根据其 name 属性选择所需的文本字段。

document.getElementsByName("searchTxt")[0].value; // Get the value of the first text field with name "searchTxt"

方法五：使用querySelector()

document.querySelector('selector').value 使用 CSS 选择器来选择所需的文本字段。

document.querySelector('#searchTxt').value; // Get the value of the text field with id "searchTxt"

方法 6：使用querySelectorAll()

document.querySelectorAll('selector')[whole_number].value 也使用 CSS 选择器来选择所需的文本字段，但返回静态 NodeList。

document.querySelectorAll('.searchField')[0].value; // Get the value of the first text field with class "searchField"

下表提供了这些方法的浏览器兼容性信息：

Browser	Method 1	Method 2	Method 3	Method 4	Method 5/6
IE6	Buggy	No	Yes	Buggy	No
IE7	Buggy	No	Yes	Buggy	No
IE8	Yes	No	Yes	Buggy	Yes
IE9	Yes	Yes	Yes	Buggy	Yes
IE10	Yes	Yes	Yes	Yes	Yes
FF3.0	Yes	Yes	Yes	Yes	No
FF3.5/FF3.6	Yes	Yes	Yes	Yes	Yes
FF4b1	Yes	Yes	Yes	Yes	Yes
GC4/GC5	Yes	Yes	Yes	Yes	Yes and Yes
Safari4/Safari5	Yes	Yes	Yes	Yes	Yes
Opera10.10/
Opera10.53/	Yes	Yes	Yes	Buggy	Yes
Opera10.60
Opera 12	Yes	Yes	Yes	Yes	Yes

以上是如何在 JavaScript 中获取输入文本字段的值？的详细内容。更多信息请关注PHP中文网其他相关文章！