home

หน้าแรก
 Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

คุณสมบัติ HTML DOM Button value

คุณสมบัติ HTML DOM Button value เกี่ยวข้องกับแอตทริบิวต์ value ขององค์ประกอบ <button> ระบุค่าที่ซ่อนอยู่ของปุ่ม คุณสมบัติ value ตั้งหรือคืนค่าของแอตทริบิวต์ value ของปุ่ม บราวเซอร์โดยทั่วไปจะส่งค่าข้อความเมื่อคลิกปุ่ม ในขณะที่บางตัวส่งข้อความระหว่างองค์ประกอบ <button>

ไวยากรณ์

ไวยากรณ์สำหรับ -

การตั้งค่าคุณสมบัติ value -

buttonObject.value = text

ที่นี่ ค่าคุณสมบัติ text คือค่าเริ่มต้นที่ให้กับปุ่ม

ตัวอย่าง

ลองดูตัวอย่างของคุณสมบัติ button value -

<!DOCTYPE html> <html> <body> <button id="Button1" name="random" value="FirstButton">My Button</button> <p>คลิกปุ่มด้านล่างเพื่อเปลี่ยนค่า value ของปุ่มข้างต้น</p> <button onclick="changeFunc()">CHANGE</button> <p id="Sample"></p> <script> function changeFunc() { document.getElementById("Button1").value = "SecondButton"; var x = document.getElementById("Button1").value; document.getElementById("Sample").innerHTML = "The button value is now " + x; } </script> </body> </html>

ผลลัพธ์

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

คุณสมบัติ HTML DOM Button value

เมื่อคลิก CHANGE -

คุณสมบัติ HTML DOM Button value

เราสร้างปุ่มที่มี value "FirstButton" พร้อม id "button1" -

<button id="Button1" name="random" value="FirstButton">My Button</button>

เราสร้างปุ่ม CHANGE ซึ่งจะเรียกใช้ changeFunc() เมื่อคลิก -

<button onclick="changeFunc()">CHANGE</button>

เมธอด changeFunc() จะดึงองค์ประกอบปุ่มแรกโดยใช้ id "Button1" และเปลี่ยนค่า value จาก "FirstButton" เป็น "SecondButton" ค่า value ของปุ่มที่เปลี่ยนแล้วจะถูกกำหนดให้ตัวแปร x และแสดงภายในย่อหน้าที่มี id "Sample" -

function changeFunc() { document.getElementById("Button1").value = "SecondButton"; var x = document.getElementById("Button1").value; document.getElementById("Sample").innerHTML = "The button value is now " + x; }