Javascript Reference - HTML DOM Option value Property








The value property sets or gets the value of the option.

Browser Support

value Yes Yes Yes Yes Yes

Syntax

Return the value property.

var v = optionObject.value 

Set the value property.

optionObject.value=value

Property Values

Value Description
value The value to be sent to the server




Return Value

A String type value representing the value attribute of the option element.

Example

The following code shows how to Return the value of the selected option in a drop-down list.


<!DOCTYPE html>
<html>
<body>
<!--  w w w  .ja  va  2  s.com-->
Select your favorite fruit:
<select id="mySelect">
  <option value="C">C</option>
  <option value="A">A</option>
  <option value="P">P</option>
  <option value="B">B</option>
</select>
<button type="button" onclick="myFunction()">test</button>

<script>
function myFunction() {
    var x = document.getElementById("mySelect").selectedIndex;
    console.log(document.getElementsByTagName("option")[x].value);
}
</script>

</body>
</html>

The code above is rendered as follows:





Example 2

The following code shows how to change the value of a specific option element.


<!DOCTYPE html>
<html>
<body>
<!--   w  w w. ja va  2 s  . c  o  m-->
Select your favorite fruit:
<select>
  <option id="myOption" value="C">C</option>
  <option value="A">A</option>
</select>
<button type="button" onclick="myFunction()">test</button>
<script>
function myFunction() {
    document.getElementById("myOption").value = "newValue";
}
</script>

</body>
</html>

The code above is rendered as follows: