Thuộc tính value của Button HTML DOM liên kết với thuộc tính value của phần tử <button>. Nó chỉ định giá trị ẩn của nút. Thuộc tính value thiết lập hoặc trả về giá trị của thuộc tính value của một nút. Các trình duyệt thường gửi văn bản giá trị khi nhấp vào nút trong khi những trình duyệt khác gửi văn bản giữa phần tử <button>.
Cú pháp
Cú pháp sau đây dùng cho:
Thiết lập thuộc tính value:
buttonObject.value = text
Ở đây, giá trị thuộc tính text là giá trị ban đầu được đưa cho nút.
Ví dụ
Hãy xem một ví dụ về thuộc tính value của nút:
<!DOCTYPE html> <html> <body> <button id="Button1" name="random" value="FirstButton">Nút của tôi</button> <p>Nhấn vào nút bên dưới để thay đổi giá trị của nút trên</p> <button onclick="changeFunc()">THAY ĐỔI</button> <p id="Sample"></p> <script> function changeFunc() { document.getElementById("Button1").value = "SecondButton"; var x = document.getElementById("Button1").value; document.getElementById("Sample").innerHTML = "Giá trị nút hiện tại là " + x; } </script> </body> </html>Kết quả
Điều này sẽ tạo ra kết quả sau:
Khi nhấn THAY ĐỔI:
Chúng ta đã tạo nút với giá trị "FirstButton" với id "button1".
<button id="Button1" name="random" value="FirstButton">Nút của tôi</button>
Chúng ta đã tạo nút THAY ĐỔI sẽ thực thi changeFunc() khi nhấp.
<button onclick="changeFunc()">THAY ĐỔI</button>
Phương thức changeFunc() sẽ lấy phần tử nút đầu tiên bằng id "Button1" và thay đổi giá trị của nó từ "FirstButton" thành "SecondButton". Giá trị nút mới được thay đổi sau đó được gán cho biến x và được hiển thị bên trong đoạn văn với id "Sample".
function changeFunc() { document.getElementById("Button1").value = "SecondButton"; var x = document.getElementById("Button1").value; document.getElementById("Sample").innerHTML = "Giá trị nút hiện tại là " + x; }