Número da opção selecionada em uma lista suspensa
Nos elementos select existe uma propriedade especial
selectedIndex, que armazena o número
da opção da lista que está atualmente selecionada.
A numeração começa em zero. Esta
propriedade pode ser tanto lida
quanto escrita, alterando a opção selecionada na lista.
Vamos ver o funcionamento desta propriedade com um exemplo. Suponha que temos a seguinte lista suspensa:
<select id="select">
<option value="one">um</option>
<option value="two" selected>dois</option>
<option value="three">três</option>
</select>
Vamos exibir o número da opção selecionada na lista:
let select = document.querySelector('#select');
console.log(select.selectedIndex); // exibirá 1
Agora vamos selecionar alguma outra opção:
let select = document.querySelector('#select');
select.selectedIndex = 2; // selecionará 'três'
Dado um input e um select. Um número qualquer é inserido no input. Ao perder o foco, torne selecionada a opção da lista cujo número é igual ao valor do input.
Faça uma lista suspensa com os nomes dos dias da semana. Faça com que via JavaScript seja selecionado por padrão neste lista o dia atual.