JavaScript中獲取HTML元素值的三種方法

JS獲取DOM元素的方法（8種）：
通過ID獲取（getElementById）
通過name屬性（getElementsByName）
通過標籤名（getElementsByTagName）
通過類名（getElementsByClassName）
獲取html的方法（document.documentElement）
獲取body的方法（document.body）
通過選擇器獲取一個元素（querySelector）
通過選擇器獲取一組元素（querySelectorAll）

JavaScript中取得元素的方法有三種：分別是：
1、getElementById() 方法：通過id取得HTML元素。
2、getElementsByName()方法：通過name取得元素，是一個數組。
3、getElementsByTagName()方法：通過HTML標籤取得元素，是一個數組。

如果要取得值可以使用value，如：var x=document.getElementById(“id”).value;

方法一：getElementById() 方法

可返回對擁有指定 ID 的第一個物件的引用。
語法：document.getElementById(id)
在 DOM 程式設計中，它的使用非常常見。您可以定義一個工具函式，這樣您就可以通過一個較短的名字來使用 getElementById() 方法了。

function id(x){
 if(typeof x == "string"){ 
 return document.getElementById(x);
 return
 
 x;
}

方法二：getElementsByName()方法

因為一個文件中的 name 屬性可能不唯一（如 HTML 表單中的單選按鈕通常具有相同的 name 屬性），所有 getElementsByName() 方法返回的是元素的陣列，而不是一個元素。

例如，下面的程式碼可以獲得form中第一個name為“inputText”的元素

var myParagragh = document.getElementsByName(“inputText”)[0].value;

方法三：getElementsByTagName()方法

如果您非常瞭解文件的結構，也可以使用 getElementsByTagName() 方法獲取文件中的一個特定的元素。
例如，下面的程式碼可以獲得文件中的第二個段落的值：

var myParagragh = document.getElementsByTagName(“p”)[1].value;

參考資料：