Zmiana wybranego punktu listy w JavaScript

W poprzedniej lekcji nauczyliśmy się pobierać wybrany punkt listy. Teraz nauczymy się zmieniać wybrany punkt za pomocą JavaScript.

Aby to zrobić, do właściwości value selecta wpisujemy wartość atrybutu value tego option, który chcemy wybrać.

Załóżmy, że mamy następujący select:

<select id="select">
	<option value="one">jeden</option>
	<option value="two" selected>dwa</option>
	<option value="three">trzy</option>
</select>

Załóżmy również, że jest przycisk:

<input type="submit" id="button">

Pobierzmy referencje do selecta i przycisku do zmiennych:

let select = document.querySelector('#select');
let button = document.querySelector('#button');

A teraz zróbmy tak, aby po naciśnięciu przycisku nasz select zmienił wybór:

button.addEventListener('click', function() {
	select.value = 'one';
});

Jeśli nasza lista nie ma atrybutów value, to do właściwości value selecta trzeba wpisać tekst znacznika option, który chcemy wybrać.

Zrób rozwijaną listę z nazwami miesięcy. Sprawdź, aby JavaScript domyślnie wybierał w tej liście bieżący miesiąc.