Computer >> Máy Tính >  >> Lập trình >> HTML

Đối tượng mật khẩu đầu vào HTML DOM

Đối tượng Mật khẩu đầu vào HTML DOM được liên kết với phần tử có loại "mật khẩu". Chúng ta có thể tạo và truy cập một phần tử đầu vào với mật khẩu kiểu bằng cách sử dụng các phương thức createElement () và getElementById () tương ứng.

Thuộc tính

Sau đây là các thuộc tính cho đối tượng mật khẩu -

Sr.No Thuộc tính &Mô tả
1 tự động hoàn thành
Để đặt hoặc trả về giá trị thuộc tính tự động hoàn thành của trường mật khẩu
2 tự động lấy nét
Để đặt hoặc trả lại nếu trường mật khẩu sẽ tự động lấy tiêu điểm khi trang tải.
3 defaultValue
Để đặt hoặc trả về giá trị mặc định của trường mật khẩu.
4 bị vô hiệu hóa
Để đặt hoặc trả về trường mật khẩu có bị vô hiệu hóa hay không.
5 biểu mẫu
Để trả về tham chiếu của biểu mẫu chứa trường mật khẩu
6 maxLength
Để đặt hoặc trả về giá trị thuộc tính maxlength của trường mật khẩu.
7 tên
Để hoặc trả về giá trị thuộc tính tên của trường mật khẩu
8 mẫu
Để đặt hoặc trả về giá trị thuộc tính mẫu của trường mật khẩu
9 trình giữ chỗ
Để đặt hoặc trả về giá trị thuộc tính trình giữ chỗ của trường mật khẩu
10 readOnly
Để đặt hoặc trả lại nếu trường mật khẩu là chỉ đọc hoặc không
11 bắt buộc
Để đặt hoặc trả lại nếu bắt buộc phải điền vào trường mật khẩu trước khi gửi biểu mẫu hay không.
12 kích thước
Để đặt hoặc trả về giá trị thuộc tính kích thước của trường mật khẩu.
13 loại
Nó là thuộc tính chỉ đọc trả về kiểu phần tử biểu mẫu mà trường mật khẩu là.
14 giá trị
Để đặt hoặc trả về giá trị thuộc tính giá trị của trường mật khẩu.

Phương pháp

Sau đây là phương thức cho đối tượng mật khẩu -

Sr.No Phương pháp &Mô tả
1 select ()
Để chọn nội dung trường mật khẩu.

Cú pháp

Sau đây là cú pháp cho -

Tạo đối tượng mật khẩu đầu vào -

var P = document.createElement("INPUT");
P.setAttribute("type", "password");

Chúng ta hãy xem một ví dụ cho đối tượng Mật khẩu nhập -

<!DOCTYPE html>
<html>
<head>
<script>
   function createPASS() {
      var P = document.createElement("INPUT");
      P.setAttribute("type", "password");
      document.body.appendChild(P);
   }
</script>
</head>
<body>
<p>Create an input field with type password by clicking the below button</p>
<button onclick="createPASS()">CREATE</button>
<br><br>
PASSWORD:
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Đối tượng mật khẩu đầu vào HTML DOM

Khi nhấp vào nút TẠO và nhập vào trường mật khẩu mới tạo -

Đối tượng mật khẩu đầu vào HTML DOM

Trong ví dụ trên -

Chúng tôi có một nút CREATE sẽ thực thi phương thức createPass () khi được người dùng nhấp vào -

<button onclick="createPASS()">CREATE</button>

Phương thức createPass () sử dụng phương thức createElement () của đối tượng tài liệu để tạo phần tử bằng cách chuyển “INPUT” làm tham số. Phần tử đầu vào mới tạo được gán cho biến P và sử dụng phương thức setAttribute (), chúng ta tạo một thuộc tính kiểu với mật khẩu giá trị. Hãy nhớ rằng setAttribute () tạo thuộc tính và sau đó chỉ định giá trị của nó nếu thuộc tính đó không tồn tại trước đó. Cuối cùng, bằng cách sử dụng phương thức appendChild () trên phần thân tài liệu, chúng tôi nối phần tử đầu vào với kiểu mật khẩu là phần tử con của phần nội dung -

function createPASS() {
   var P = document.createElement("INPUT");
   P.setAttribute("type", "password");
   document.body.appendChild(P);
}