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: