คุณสมบัติแบบฟอร์ม HTML DOM Fieldset

คุณสมบัติแบบฟอร์ม HTML DOM Fieldset ส่งกลับการอ้างอิงแบบฟอร์มของวัตถุแบบฟอร์มประเภท นี่สำหรับองค์ประกอบ

ที่มีอยู่ในแบบฟอร์มที่กำหนด เป็นคุณสมบัติแบบอ่านอย่างเดียว หากไม่มี fieldset ที่ระบุอยู่ในฟอร์ม ค่า null จะถูกส่งกลับ

ไวยากรณ์

ต่อไปนี้เป็นไวยากรณ์สำหรับคุณสมบัติของรูปแบบชุดฟิลด์ -

fieldsetObject.form

ตัวอย่าง

ให้เรามาดูตัวอย่างคุณสมบัติของ fieldset form −

<!DOCTYPE html>
<html>
<head>
<script>
   function formId() {
      var field = document.getElementById("FieldSet1").form.id;
      document.getElementById("Sample").innerHTML = "The id of the form in which fieldset
      element is present is "+field;
   }
</script>
</head>
<body>
<h1>Sample FORM</h1>
<form id="FORM1">
<fieldset id="FieldSet1">
<legend>User Data:</legend>
Name:<input type="text"><br>
Address:<input type="text"><br>
Age:<input type="text">
</fieldset>
</form>
<br>
<button onclick="formId()">GET ID</button>
<p id="Sample"></p>
</body>
</html>

ผลลัพธ์

สิ่งนี้จะสร้างผลลัพธ์ต่อไปนี้ -

คุณสมบัติแบบฟอร์ม HTML DOM Fieldset

เมื่อคลิกปุ่ม GET ID -

คุณสมบัติแบบฟอร์ม HTML DOM Fieldset

ในตัวอย่างข้างต้น −

ขั้นแรกเราได้สร้างองค์ประกอบ

ที่มี id “FORM1” ที่มีองค์ประกอบ

ที่มี id “FieldSet1” -

<form id="FORM1">
<fieldset id="FieldSet1">
<legend>User Data:</legend>
Name:<input type="text"><br>
Address:<input type="text"><br>
Age:<input type="text">
</fieldset>
</form>

จากนั้นเราได้สร้างปุ่ม GET ID ที่จะรันฟังก์ชัน formId() เมื่อผู้ใช้คลิก -

<button onclick="formId()">GET ID</button>

ฟังก์ชัน formId() รับองค์ประกอบ fieldset โดยใช้ getElementById() จากนั้นรับคุณสมบัติ form.id ซึ่งจะส่งคืน id ของฟอร์มซึ่งมีองค์ประกอบ fieldset ที่ระบุอยู่ ค่าที่ส่งคืน form.id ถูกกำหนดให้กับตัวแปรฟิลด์ จากนั้นตัวแปรจะแสดงในย่อหน้าที่มี id "ตัวอย่าง" ที่เกี่ยวข้องและใช้คุณสมบัติ innerHTML เพื่อกำหนดข้อความที่ต้องการ -

function formId() {
   var field = document.getElementById("FieldSet1").form.id;
   document.getElementById("Sample").innerHTML = "The id of the form in which fieldset element is    present is "+field;
}