在網(wǎng)頁(yè)開(kāi)發(fā)中，文本框是經(jīng)常用到的元素。而在JavaScript中，我們可以輕松地獲取文本框的值。下面就讓我們來(lái)學(xué)習(xí)一些獲得文本框值的方法。

首先，我們可以通過(guò)getElementById方法來(lái)獲取文本框的值。例如，在下面這個(gè)例子中，我們可以輸入一些文本并點(diǎn)擊“顯示輸入”的按鈕，就可以將輸入的值顯示出來(lái)。

<input type="text" id="inputBox">
<br><br>
<button onclick="showInput()">顯示輸入</button>
<script>
function showInput() {
var input = document.getElementById("inputBox").value;
alert("你輸入的是：" + input);
}
</script>

上面的代碼中，我們定義了一個(gè)inputBox的文本框，并在按鈕的onclick事件中調(diào)用showInput函數(shù)。在showInput函數(shù)中，我們通過(guò)getElementById方法獲取inputBox的值，并通過(guò)alert方法彈出對(duì)話框顯示輸入的值。

除了getElementById方法，我們還可以使用getElementsByTagName方法。該方法返回一個(gè)數(shù)組，我們可以通過(guò)索引或循環(huán)遍歷的方式獲取文本框的值。

<input type="text" name="inputBox">
<input type="text" name="inputBox">
<br><br>
<button onclick="showInput()">顯示輸入</button>
<script>
function showInput() {
var inputs = document.getElementsByTagName("input");
var inputVal = "";
for (var i = 0; i < inputs.length; i++) {
if (inputs[i].name === "inputBox") {
inputVal += inputs[i].value + " ";
}
}
alert("你輸入的是：" + inputVal);
}
</script>

在上面的代碼中，我們定義了兩個(gè)name為inputBox的文本框，并在按鈕的onclick事件中調(diào)用showInput函數(shù)。在showInput函數(shù)中，我們通過(guò)getElementsByTagName方法獲取所有的input元素，并通過(guò)循環(huán)遍歷的方式獲取文本框的值。

如果你只想獲取頁(yè)面中一個(gè)指定class名的文本框的值，可以使用getElementsByClassName方法。例如：

<input type="text" class="inputBox">
<br><br>
<button onclick="showInput()">顯示輸入</button>
<script>
function showInput() {
var input = document.getElementsByClassName("inputBox")[0].value;
alert("你輸入的是：" + input);
}
</script>

在上面的代碼中，我們定義了一個(gè)class名為inputBox的文本框，并在按鈕的onclick事件中調(diào)用showInput函數(shù)。在showInput函數(shù)中，我們通過(guò)getElementsByClassName方法獲取指定class名的元素，并通過(guò)索引的方式獲取第一個(gè)文本框的值。

除了以上方法外，我們還可以通過(guò)name屬性或者jQuery等庫(kù)來(lái)獲取文本框的值。通過(guò)這些方法，我們可以輕松地獲取并操作文本框中的值，為網(wǎng)頁(yè)應(yīng)用的實(shí)現(xiàn)提供了便利。