Ändern des ausgewählten Listeneintrags in JavaScript

In der vorherigen Lektion haben wir gelernt, wie man den ausgewählten Listeneintrag erhält. Lassen Sie uns nun den ausgewählten Eintrag mit JavaScript ändern.

Dazu schreiben wir in die Eigenschaft value des Select-Elements den Wert des value-Attributs desjenigen option, den wir auswählen möchten.

Angenommen, wir haben das folgende Select-Element:

<select id="select">
	<option value="one">eins</option>
	<option value="two" selected>zwei</option>
	<option value="three">drei</option>
</select>

Angenommen, es gibt auch einen Button:

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

Wir holen Referenzen auf das Select-Element und den Button in Variablen:

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

Und nun sorgen wir dafür, dass bei einem Klick auf den Button unsere Auswahl geändert wird:

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

Wenn unsere Liste keine value-Attribute hat, muss in die Eigenschaft value des Select-Elements der Text des option-Tags geschrieben werden, den wir auswählen möchten.

Erstellen Sie eine Dropdown-Liste mit den Namen der Monate. Sorgen Sie dafür, dass JavaScript standardmäßig den aktuellen Monat in dieser Liste auswählt.