有多种方法可以直接获取输入文本框值（无需将输入元素包装在表单元素中）：
方法一：
document.getElementById('textbox_id').value获取所需框的值
例如， document.getElementById("searchTxt").value;
注意：方法 2,3,4 和 6 返回元素的集合，因此使用 [whole_number] 来获取所需的出现次数。对于第一个元素，使用 [0]，对于第二个元素，使用1，依此类推...
方法二：
使用
document.getElementsByClassName('class_name')[whole_number].value返回 Live HTMLCollection
例如， document.getElementsByClassName("searchField")[0].value;如果这是您页面中的第一个文本框。
方法三：
使用document.getElementsByTagName('tag_name')[whole_number].value它还返回一个实时 HTMLCollection
例如 document.getElementsByTagName("input")[0].value;，如果这是您页面中的第一个文本框。
方法四：
document.getElementsByName('name')[whole_number].value它还 > 返回一个活动的 NodeList
例如， document.getElementsByName("searchTxt")[0].value;如果这是您页面中第一个名称为“searchtext”的文本框。
方法五：
使用强大document.querySelector('selector').value的 CSS 选择器来选择元素
例如， document.querySelector('#searchTxt').value;按 id
document.querySelector('.searchField').value;选择，按类别
document.querySelector('input').value;选择，按标签
document.querySelector('[name="searchTxt"]').value;名称选择，按名称选择
方法六：
document.querySelectorAll('selector')[whole_number].value它也使用 CSS 选择器来选择元素，但它会将具有该选择器的所有元素作为静态节点列表返回。
例如， document.querySelectorAll('#searchTxt')[0].value; 按 id
document.querySelectorAll('.searchField')[0].value;选择，按类别
document.querySelectorAll('input')[0].value; 选择，按标签
document.querySelectorAll('[name="searchTxt"]')[0].value;名称选择，按名称选择
支持
Browser Method1 Method2 Method3 Method4 Method5/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 IE=Internet Explorer
FF3.5/FF3.6 Y Y Y Y Y FF=Mozilla Firefox
FF4b1 Y Y Y Y Y GC=Google Chrome
GC4/GC5 Y Y Y Y Y Y=YES,N=NO
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
有用的链接
要查看这些方法的支持以及所有错误，包括更多详细信息，请单击此处
静态集合和实时集合之间的区别单击此处
NodeList 和 HTMLCollection 的区别点击这里