HTML DOM Input Hidden用法及代碼示例

HTML DOM中的Input Hidden對象表示類型為“hidden”的<input>元素。可以使用getElementById()方法訪問該元素。

用法:

document.getElementById("id");

將id分配給<input>標簽的位置。

屬性值：

defaultvalue:它用於設置或返回隱藏輸入字段的默認值。
form:它返回包含隱藏輸入字段的表單的引用。
name:它用於設置或返回隱藏輸入字段的名稱屬性值。
type:它返回隱藏輸入字段所屬的表單元素的類型。
value:它用於設置或返回隱藏輸入字段的value屬性的值。

範例1：本示例描述了getElementById()方法，該方法用於訪問type = “hidden”屬性的<input>元素。

   
<html>  
<head>  
<title> DOM Input Hidden Object </title>  
</head>  
<body>  
    <center> 
        <h1 style = "color:green;"> 
            GeeksForGeeks 
        </h1> 
           
        <h2>DOM Input Hidden Object</h2> 
           
        <input type = "hidden" id = "myGeeks"
                    value="GeeksForGeeks"> 
           
        <button onclick = "Geeks()"> 
            Submit 
        </button> 
           
        <p id = "sudo"></p> 
           
        <script> 
            function Geeks() { 
                var g = document.getElementById("myGeeks").value;  
                document.getElementById("sudo").innerHTML = g;  
            } 
        </script> 
    </center> 
</body> 
   
</html>

輸出：
在單擊按鈕之前：

單擊按鈕後：

範例2：可以使用document.createElement方法創建輸入隱藏對象。

<!DOCTYPE html> 
<html> 
      
<head> 
    <title> 
        DOM Input Hidden Object 
    </title> 
</head> 
  
<body> 
    <center> 
        <h1 style = "color:green;"> 
            GeeksForGeeks 
        </h1> 
          
        <h2>DOM Input Hidden Object</h2> 
          
        <input type = "hidden" id = "myGeeks"
                    value="GeeksForGeeks"> 
          
        <button onclick = "Geeks()"> 
            Submit 
        </button> 
          
        <p id = "sudo"></p> 
          
        <script> 
            function Geeks() { 
                var g = document.createElement("INPUT"); 
                g.setAttribute("type", "hidden"); 
                document.body.appendChild(g); 
                  
                document.getElementById("sudo").innerHTML 
                        = "Hidden Content"; 
            } 
        </script> 
    </center> 
</body> 
  
</html>

輸出：
在單擊按鈕之前：

單擊按鈕後：

支持的瀏覽器：下麵列出了DOM輸入隱藏對象支持的瀏覽器：

穀歌瀏覽器
IE瀏覽器
Firefox
Opera
Safari

相關用法

注：本文由純淨天空篩選整理自ManasChhabra2大神的英文原創作品 HTML | DOM Input Hidden Object。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。