Thuộc tính Giá trị số đầu vào HTML DOM được liên kết với phần tử đầu vào có kiểu =”Số” và có thuộc tính giá trị. Thuộc tính này được sử dụng để trả về giá trị của thuộc tính giá trị phần tử đầu vào hoặc để đặt nó. Thuộc tính này được sử dụng để chỉ định giá trị mặc định cho các phần tử và nó cũng thay đổi giá trị của nó thành đầu vào của người dùng.
Cú pháp
Sau đây là cú pháp cho -
Đặt thuộc tính giá trị -
numberObject.value = number;
Ở đây, số được sử dụng để chỉ định giá trị cho trường số.
Ví dụ
Chúng ta hãy xem một ví dụ cho thuộc tính Giá trị số đầu vào -
<!DOCTYPE html>
<html>
<body>
<h1>Input Number Value property</h1>
PHONE NO: <input type="number" value="222" id="NUMBER1">
<p>Get the above element value by clicking the below button</p>
<button onclick="getValue()">Get Value</button>
<p id="Sample"></p>
<script>
function getValue() {
var t = document.getElementById("NUMBER1").value;
document.getElementById("Sample").innerHTML = "The value for the input field is : "+t;
}
</script>
</body>
</html> Đầu ra
Điều này sẽ tạo ra kết quả sau -
Khi nhấp vào nút “Nhận giá trị” -
Trong ví dụ trên -
Chúng tôi đã tạo một trường đầu vào với số loại và id của nó được đặt thành “NUMBER1”. Chúng tôi đã chỉ định một giá trị mặc định cho trường số bằng cách sử dụng thuộc tính giá trị.
PHONE NO: <input type="number" value="222" id="NUMBER1">
Sau đó, chúng tôi đã tạo nút “Nhận giá trị” sẽ thực thi phương thức getValue () khi người dùng nhấp vào -
<button onclick="getValue()">Get Value</button>
GetValue () nhận phần tử đầu vào bằng phương thức getElementById () và gán giá trị thuộc tính “value” của nó cho biến t. Sau đó, biến này được hiển thị trong đoạn có id “Sample” bằng cách sử dụng thuộc tính innerHTML -
function getValue() {
var t = document.getElementById("NUMBER1").value;
document.getElementById("Sample").innerHTML = "The value for the input field is : "+t;
}