Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> HTML

Thuộc tính size của Input Password trong HTML DOM

Thuộc tính size của HTML DOM Input Password được sử dụng để thiết lập hoặc trả về giá trị thuộc tính size của trường nhập mật khẩu. Nó định nghĩa chiều rộng trường mật khẩu tính bằng số ký tự. Chiều rộng mặc định là 20 ký tự.

Cú pháp

Cú pháp để thiết lập thuộc tính size của password:

passwordObject.size = number

Ở đây, number đại diện cho chiều rộng trường mật khẩu tính bằng ký tự. Mặc định là 20 ký tự.

Ví dụ

Ví dụ minh họa cho thuộc tính size của Input Password:

<!DOCTYPE html> <html> <body> 
<h1>Thuộc tính size của Input Password</h1> 
Mật khẩu: <input type="password" id="PASS1"> 
<p>Thay đổi chiều rộng trường mật khẩu bằng cách nhấn nút dưới đây</p> 
<button onclick="changeSize()">THAY ĐỔI</button> 
<p id="Sample"> 
<script> 
    function changeSize() { 
        document.getElementById("PASS1").size+=20; 
        var s=document.getElementById("PASS1").size; 
        document.getElementById("Sample").innerHTML="Chiều rộng trường mật khẩu hiện là: "+ s; 
    } 
</script> </body> </html>

Kết quả

Đoạn mã trên sẽ tạo ra kết quả như sau:

Thuộc tính size của Input Password trong HTML DOM

Khi nhấn nút THAY ĐỔI:

Thuộc tính size của Input Password trong HTML DOM

Trong ví dụ trên:

Chúng ta tạo trường mật khẩu với id="PASS1":

Mật khẩu: <input type="password" id="PASS1">

Tạo nút THAY ĐỔI thực thi phương thức changeSize() khi được nhấn:

<button onclick="changeSize()">THAY ĐỔI</button>

Phương thức changeSize() dùng getElementById() để lấy trường password và tăng thuộc tính size thêm 20. Chiều rộng hiện tăng 20 ký tự. Dùng lại size để lấy kích thước mới gán cho biến s. Giá trị size mới hiển thị trong đoạn văn id="Sample":

function changeSize() { 
    document.getElementById("PASS1").size+=20; 
    var s=document.getElementById("PASS1").size; 
    document.getElementById("Sample").innerHTML="Chiều rộng trường mật khẩu hiện là: "+ s; 
}