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

HTML DOM Chọn thuộc tính biểu mẫu


Thuộc tính biểu mẫu HTML DOM select trả về tham chiếu của biểu mẫu có chứa danh sách thả xuống.

Cú pháp

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

object.form

Ví dụ

Hãy để chúng tôi xem một ví dụ về thuộc tính biểu mẫu HTML DOM select -

<!DOCTYPE html>
<html>
<head>
<style>
   body{
      text-align:center;
      background-color:#363946;
      color:#fff;
   }
   form{
      margin:2.5rem auto;
      border:1px solid #fff;
      padding:2rem;
   }
   .drop-down{
      display:block;
      width:35%;
      border:2px solid #fff;
      font-weight:bold;
      padding:2px;
      margin:1rem auto;
      outline:none;
   }
   button{
      background-color:#db133a;
      border:none;
      cursor:pointer;
      padding:8px 16px;
      color:#fff;
      border-radius:5px;
      font-size:1.05rem;
      outline:none;
   }
   .show{
      font-weight:bold;
      font-size:1.4rem;
   }
</style>
</head>
<body>
<h1>form Property Demo</h1>
<form id="Form 1">
<legend style="font-weight:bold;">Form 1</legend>
<p>Hi, Select your favourite subject:</p>
<select class='drop-down' name="Drop Down List">
<option>Physics</option>
<option>Maths</option>
<option>Chemistry</option>
<option>English</option>
<option>Economics</option>
<option>Hindi</option>
<option>Biology</option>
</select>
</form>
<button onclick="identify()">Identify form of drop-down</button>
<p class="show"></p>
<script>
   function identify() {
      var formId = document.querySelector(".drop-down").form.id;
      document.querySelector(".show").innerHTML = "Hi! I'm from " + formId;
   }
</script>
</body>
</html>

Đầu ra

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

HTML DOM Chọn thuộc tính biểu mẫu

Nhấp vào “ xác định hình thức thả xuống ”Để xác định biểu mẫu tham chiếu danh sách thả xuống -

HTML DOM Chọn thuộc tính biểu mẫu