Número de opción seleccionada en lista desplegable
En los elementos select existe una propiedad especial
selectedIndex, que almacena el número
de la opción de la lista que está actualmente seleccionada.
La numeración comienza desde cero. Esta
propiedad se puede tanto leer
como escribir, cambiando la opción seleccionada de la lista.
Veamos el trabajo con esta propiedad con un ejemplo. Supongamos que tenemos la siguiente lista desplegable:
<select id="select">
<option value="one">uno</option>
<option value="two" selected>dos</option>
<option value="three">tres</option>
</select>
Mostremos el número de la opción seleccionada en la lista:
let select = document.querySelector('#select');
console.log(select.selectedIndex); // mostrará 1
Y ahora seleccionemos alguna otra opción:
let select = document.querySelector('#select');
select.selectedIndex = 2; // seleccionará 'tres'
Dado un input y un select. Se introduce un número en el input. Al perder el foco, haga que se seleccione la opción de la lista cuyo número sea igual al valor del input.
Cree una lista desplegable con los nombres de los días de la semana. Haga que mediante JavaScript por defecto se seleccione en esta lista el día actual.