如何通過js獲得input文本框輸入的值。
- 前言
我們編寫的被載入浏覽器的HTML頁面都是一個 Document 對象。對于Document對象可以使我們通過代碼(比如javascript)對HTML頁面中的所有元素進行通路。比如div标簽元素、span元素、input元素等等。
Document對象具有以下的屬性：
Body：提供對 <body> 元素的直接通路。對于定義了架構集的文檔，該屬性引用最外層的 <frameset>。
cookie： 設定或傳回與目前文檔有關的所有 cookie。
domain：傳回目前文檔的域名
lastModified：傳回文檔被最後修改的日期和時間。
referrer：傳回載入目前文檔的文檔的 URL。
title：傳回目前文檔的标題。
URL: 傳回目前文檔的 URL。
Document 對象的方法：
open():打開一個流，以收集來自任何 document.write() 或 document.writeln() 方法的輸出。
close():關閉用 document.open() 方法打開的輸出流，并顯示標明的資料。
getElementById():傳回對擁有指定 id 的第一個對象的引用。
getElementsByName():傳回帶有指定名稱的對象集合。
getElementsByTagName():傳回帶有指定标簽名的對象集合。
write():向文檔寫 HTML 表達式 或 JavaScript 代碼。
writeln():等同于 write() 方法，不同的是在每個表達式之後寫一個換行符。
二．執行個體
通過上述的document對象及其方法我們可以采用js擷取input文本框輸入的内容，在html中input也是元素内容，代碼如下
<input id='inputValueID' type='text' style='margin-left: 18px;width: 80px; border-radius: 5px; outline: medium; text-align: center; border: 1px solid #666666;'/>
通過id以及document對象的getElementById()方法，我們可以擷取其值代碼如下
function selectValue() {
//聲明value變量并将擷取的值賦給value
var value = document.getElementById("inputValueID").value;
//視窗彈出input文本框輸入的值
alert(value);
}
結果如下
同樣，還可以通過getElementsByName方法和getElementsByTagName方法擷取值。
getElementsByName():
<input name='inputValueID' type='text' style='margin-left: 18px;width: 80px; border-radius: 5px; outline: medium; text-align: center; border: 1px solid #666666;'/>
function selectValue() {
//聲明value變量并将擷取的值賦給value
var value = document.getElementByName("inputValueID").value;
//視窗彈出input文本框輸入的值
alert(value);
}
getElementsByTagName():
function selectValue() {
//聲明value變量并将擷取的值賦給value
var value = document.getElementByName("input").value;
//如果是p标簽則是,
var value = document.getElementByName("P").value;
//如果傳遞的是*,傳回所有元素的清單，元素排列的順序就是它們在html中的順序。
var value = document.getElementByName("*");
//視窗彈出input文本框輸入的值
alert(value);
}
申明：以上關于document介紹部分内容參考W3Cschool,如有侵權，聯系作者删除。