คุณสมบัติชื่อ HTML DOM Fieldset

คุณสมบัติชื่อ HTML DOM Fieldset ใช้สำหรับรับหรือตั้งค่าแอตทริบิวต์ชื่อขององค์ประกอบ

แอตทริบิวต์ชื่อช่วยในการระบุข้อมูลแบบฟอร์มหลังจากที่ส่งแบบฟอร์มแล้วหรือเพื่อการอ้างอิงองค์ประกอบของแบบฟอร์ม

ไวยากรณ์

ต่อไปนี้เป็นไวยากรณ์สำหรับ −

การตั้งค่าคุณสมบัติชื่อ fieldset -

fieldsetObject.name = name

ที่นี่ ชื่อ ระบุชื่อ fieldset

ตัวอย่าง

ให้เราดูตัวอย่างคุณสมบัติชื่อ Fieldset -

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

ผลลัพธ์

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

คุณสมบัติชื่อ HTML DOM Fieldset

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

คุณสมบัติชื่อ HTML DOM Fieldset

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

ขั้นแรกเราได้สร้าง fieldset ที่มีชื่อ “FS1” และ id “FieldSet1” ภายใน form element -

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

จากนั้นเราได้สร้างปุ่ม GET NAME ซึ่งจะรัน fieldname() method เมื่อผู้ใช้คลิก -

<button onclick="fieldName()">GET NAME</button>

fieldname() วิธีการรับองค์ประกอบ fieldset โดยใช้วิธี getElementById() จากนั้นรับค่าแอตทริบิวต์ชื่อและกำหนดให้กับฟิลด์ตัวแปร ค่านี้จะแสดงในย่อหน้าด้วยรหัส "ตัวอย่าง" และกำหนดข้อความโดยใช้คุณสมบัติ innerHTML -

function fieldName() {
   var field = document.getElementById("FieldSet1").name;
   document.getElementById("Sample").innerHTML = "The fieldset name is "+field;
}