HTML DOM Input Password用法及代碼示例

HTML DOM中的輸入密碼對象用於表示type =“ password”的HTML輸入元素。可以使用getElementById()方法訪問類型=“ password”的輸入元素。

用法:

用於訪問輸入類型=“密碼”
```
document.getElementById("id");
```
它用於創建type =“ password”元素。
```
document.createElement("input");
```

對象屬性：

屬性	描述
type	此屬性用於返回密碼字段屬於哪種類型的表單元素。
value	此屬性用於設置或返回密碼字段的value屬性的值。
autocomplete	此屬性用於設置或返回密碼字段的自動完成屬性的值。
autofocus	此屬性用於設置或返回在頁麵加載時密碼字段是否應自動獲得焦點。
defaultValue	此屬性用於設置或返回密碼字段的默認值。
disabled	此屬性用於設置或返回是否禁用密碼字段。
form	此屬性用於返回對包含密碼字段的表單的引用。
maxLength	此屬性用於設置或返回密碼字段的maxlength屬性值。
name	此屬性用於設置或返回密碼字段的name屬性的值。
placeholder	此屬性用於設置或返回密碼字段的占位符屬性的值。
readOnly	此屬性用於設置或返回密碼字段是否為隻讀。
required	此屬性用於設置或返回在提交表單之前是否必須填寫密碼字段。
size	此屬性用於設置或返回密碼字段的value屬性的值。

輸入數字對象方法：

select()：這用於選擇密碼字段的內容。

示例1：

<!DOCTYPE html> 
<html> 
  
<body style="text-align:center;"> 
  
    <h1 style="color:green;">   
            GeeksForGeeks   
        </h1> 
  
    <h2>DOM Input Password Object</h2> Password:
    <input type="password"
           id="myPsw" 
           value="geeks12"> 
  
    <p>Click the button to get the password  
      of the password field.</p> 
  
    <button onclick="myFunction()"> 
      Click Here! 
   </button> 
  
    <p id="demo"></p> 
  
    <script> 
        function myFunction() { 
            var x =  
            document.getElementById( 
              "myPsw").value; 
            
            document.getElementById( 
              "demo").innerHTML = x; 
        } 
    </script> 
  
</body> 
  
</html>

輸出：

在單擊按鈕之前：

單擊按鈕後：

示例-2：

<!DOCTYPE html> 
<html> 
  
<body style="text-align:center;"> 
  
    <h1 style="color:green;">   
            GeeksForGeeks   
        </h1> 
  
    <h2>DOM Input Password Object</h2> 
  
    <p>Click the button to create a 
      Password Field.</p> 
  
    <button onclick="myFunction()"> 
      Click Here! 
    </button> 
  
    <script> 
        function myFunction() { 
            
            // Creating input element. 
            var x = document.createElement("INPUT"); 
              
            // Set type password. 
            x.setAttribute("type", "password"); 
            x.setAttribute("value", "geeks12"); 
            document.body.appendChild(x); 
        } 
    </script> 
  
</body> 
  
</html>

輸出：

在單擊按鈕之前：

單擊按鈕後：

支持的瀏覽器：

穀歌瀏覽器
火狐瀏覽器
Edge
Safari
Opera

相關用法

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