ออบเจ็กต์ HTML DOM Input Reset

ออบเจ็กต์ HTML DOM Input Reset เกี่ยวข้องกับองค์ประกอบ <input> ที่มี type “reset” เราสามารถสร้างและเข้าถึงองค์ประกอบ input ที่มี type reset โดยใช้เมธอด createElement() และ getElementById() ตามลำดับ

คุณสมบัติ

คุณสมบัติต่อไปนี้สำหรับออบเจ็กต์ Input reset:

คุณสมบัติ	คำอธิบาย
autofocus	ตั้งค่าหรือส่งคืนว่าปุ่มรีเซ็ตควรได้รับโฟกัสอัตโนมัติเมื่อโหลดหน้าหรือไม่
defaultValue	ตั้งค่าหรือส่งคืนค่าเริ่มต้นของปุ่มรีเซ็ต
disabled	ตั้งค่าหรือส่งคืนว่าปุ่มรีเซ็ตถูกปิดใช้งานหรือไม่
form	ส่งคืนการอ้างอิงของฟอร์มที่มีปุ่มรีเซ็ต
name	ตั้งค่าหรือส่งคืนค่าแอตทริบิวต์ name ของปุ่มรีเซ็ต
type	ส่งคืนประเภทขององค์ประกอบฟอร์มสำหรับปุ่มรีเซ็ต
value	ตั้งค่าหรือส่งคืนค่าแอตทริบิวต์ value ของคอนโทรลสไลเดอร์

ตัวอย่าง

มาดูตัวอย่างการใช้オอบเจ็กต์ Input Reset:

<!DOCTYPE html> <html> <head> <script>    function resetCreate() {       var Res = document.createElement("INPUT");       Res.setAttribute("type", "reset");       document.body.appendChild(Res);    } </script> </head> <body> <h1>Input Reset object</h1> <p>สร้างช่อง input ที่มี type reset โดยคลิกปุ่มด้านล่าง</p> <button onclick="resetCreate()">CREATE</button> <br><br> </body> </html>

ผลลัพธ์

จะได้ผลลัพธ์ดังนี้:

ออบเจ็กต์ HTML DOM Input Reset

เมื่อคลิกปุ่ม CREATE:

ออบเจ็กต์ HTML DOM Input Reset

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

เราสร้างปุ่ม CREATE ที่จะเรียกใช้เมธอด resetCreate() เมื่อผู้ใช้คลิก:

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

เมธอด resetCreate() ใช้เมธอด createElement() ของออบเจ็กต์ document เพื่อสร้างองค์ประกอบ <input> โดยส่ง “INPUT” เป็นพารามิเตอร์ องค์ประกอบ input ที่สร้างใหม่ถูกกำหนดให้ตัวแปร Res และใช้เมธอด setAttribute() เพื่อสร้างแอตทริบิวต์ type ด้วยค่า reset

จำไว้ว่า setAttribute() จะสร้างแอตทริบิวต์และกำหนดค่าหากแอตทริบิวต์นั้นไม่มีอยู่ก่อนหน้านี้ สุดท้ายใช้เมธอด appendChild() บน document body เพื่อเพิ่มองค์ประกอบ input ที่มี type reset เป็นลูกของ body:

function resetCreate() {    var Res = document.createElement("INPUT");    Res.setAttribute("type", "reset");    document.body.appendChild(Res); }