Tengo un cuadro desplegable en mi sitio web que le permite seleccionar su tema. El problema es que no puedo encontrar la manera de implementarlo. Aquí está el javascript:

 //selects the select element let selectTheme = document.querySelector("#select-theme"); //selects the stylesheet let style = document.querySelector("#pagestyle"); selectTheme.addEventListener('onchange', () => { if (selectTheme.value == "dark") { style.setAttribute("href", "./css/style.css"); } if (selectTheme.value == "light") { style.setAttribute("href", "./css/style2.css"); } console.log(selectTheme.value); })

HTML:

 <link rel="stylesheet" type="text/css" href="" id="pagestyle"> <div class="selection-box"> <select class="select-theme" name="selectTheme" id="select-theme"> <option value="dark" id="dark">dark</option> <option value="light" id="light">light</option> </select> </div>

Incluso el oyente en sí mismo no parece funcionar, ya que no imprime el valor desplegable.

También tenga en cuenta que esto no es todo mi HTML. Acabo de copiar y pegar los elementos relevantes.