Vider un select box en JavaScript

En JavaScript, on sait qu'on peut retirer tous les éléments d'une liste déroulante en effectuant une boucle sur chaque élément pour effacer dynamiquement les options du DOM.

Lorsqu'on veut les vider toutes d'un seul coup, on peut utiliser le raccourci suivant (JavaScript pur) :

document.getElementById("element_id").length = 0;

Dans plusieurs cas, le premier élément du select box est une étiquette indiquant une instruction du type "Veuillez faire un choix", avec une valeur nulle. Si on veut conserver cette étiquette (la première option du select), il suffit de spécifier le nombre d'éléments à garder :

document.getElementById("element_id").length = 1;

Avec la librairie jQuery, on pourrait avoir tendance à écrire le bout de code suivant :

$j("element_id").length = 1;

Alors qu'en réalité, comme le sélecteur CSS de jQuery retourne une collection, il faudra lui spécifier qu'on veut utiliser le premier élément retourné dans la liste avec get() (si on l'appelle avec un ID, ce sera l'unique item, à l'indice 0) :

$j("element_id").get(0).length = 1;

Notez que j'utilise la variable $j dans mes exemples car je me sers généralement de la librairie jQuery en mode noConflict() que j'affecte à une variable pour éviter les mauvaises surprises.