Thuộc tính giá trị Nút DOM HTML được liên kết với thuộc tính giá trị của phần tử
Cú pháp
Sau đây là cú pháp cho -
Đặt thuộc tính giá trị -
buttonObject.value = text
Ở đây, giá trị thuộc tính văn bản là giá trị ban đầu được cấp cho nút.
Ví dụ
Hãy để chúng tôi xem một ví dụ về thuộc tính giá trị nút -
<!DOCTYPE html>
<html>
<body>
<button id="Button1" name="random" value="FirstButton">My Button</button>
<p>Click on the below button to change the above button 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> Đầu ra
Điều này sẽ tạo ra kết quả sau -
Khi nhấp vào THAY ĐỔI -
Đầu tiên, chúng tôi đã tạo một nút có giá trị “FirstButton” với id “button1”.
<button id="Button1" name="random" value="FirstButton">My Button</button>
Sau đó, chúng tôi đã tạo một nút CHANGE sẽ thực thi changeFunc () khi nhấp chuột.
<button onclick="changeFunc()">CHANGE</button>
Phương thức changeFunc () sẽ nhận phần tử nút đầu tiên bằng cách sử dụng id “Button1” của nó và thay đổi giá trị của nó từ “FirstButton” thành “SecondButton”. Giá trị nút mới 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="The button value is now "+x;
}