Αλλαγή του επιλεγμένου στοιχείου λίστας σε JavaScript

Στο προηγούμενο μάθημα μάθαμε πώς να λαμβάνουμε το επιλεγμένο στοιχείο μιας λίστας. Ας μάθουμε τώρα πώς να αλλάζουμε το επιλεγμένο στοιχείο χρησιμοποιώντας JavaScript.

Για να το κάνουμε αυτό, γράφουμε στην ιδιότητα value του select την τιμή του χαρακτηριστικού value εκείνου του option που θέλουμε να επιλέξουμε.

Ας υποθέσουμε ότι έχουμε το παρακάτω select:

<select id="select">
	<option value="one">ένα</option>
	<option value="two" selected>δύο</option>
	<option value="three">τρία</option>
</select>

Ας υποθέσουμε επίσης ότι υπάρχει ένα κουμπί:

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

Ας πάρουμε αναφορές στο select και στο κουμπί σε μεταβλητές:

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

Και τώρα ας κάνουμε έτσι ώστε κατά το πάτημα του κουμπιού το select μας να αλλάξει την επιλογή:

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

Εάν η λίστα μας δεν έχει χαρακτηριστικά value, τότε στην ιδιότητα value του select πρέπει να γράψουμε το κείμενο της ετικέτας option που θέλουμε να επιλέξουμε.

Δημιουργήστε μια αναπτυσσόμενη λίστα με τα ονόματα των μηνών. Κάντε έτσι ώστε το JavaScript από προεπιλογή να επιλέγει σε αυτήν τη λίστα τον τρέχοντα μήνα.