sou iniciante no mundo Node, e estou com dificuldades em relacionar um arquivo .js em um HTML.
peguei um código simples, nele tenho um combobox que é preenchido ao pressionar um botão:
//app.js
var express = require('express');
var app = express();
app.get('/', (req, res)=>{
res.sendFile('page.html', {root:__dirname});
});
app.listen(3000);
Este é o código que quero por no HTML:
//page.js
document.getElementById("btnCarregar").onclick = function () {
var comboCidades = document.getElementById("cboCidades");
var opt0 = document.createElement("option");
opt0.value = "0";
opt0.text = "";
comboCidades.add(opt0, comboCidades.options[0]);
var opt1 = document.createElement("option");
opt1.value = "scs";
opt1.text = "São Caetano do Sul";
comboCidades.add(opt1, comboCidades.options[1]);
var opt2 = document.createElement("option");
opt2.value = "sa";
opt2.text = "Santo André";
comboCidades.add(opt2, comboCidades.options[2]);
var opt3 = document.createElement("option");
opt3.value = "sbc";
opt3.text = "São Bernardo do Campo";
comboCidades.add(opt3, comboCidades.options[3]);
};
E o respectivo HTML:
<head>
</head>
<body>
<form action="#" method="post">
<p>
<select id="cboCidades"></select>
</p>
<p>
<input type="button" id="btnCarregar" value="Carregar combobox" />
</p>
</form>
<script src="page.js"></script>
</body>
Então...se eu iniciar o servidor, e acessar o localhost:3000, a página é carregada normalmente, porém o botão não funciona pois ele não consegue utilizar o código do .js externo e no console do navegador fica aparecendo essa mensagem:
Mas...se eu simplesmente abrir o arquivo HTML o botão funciona normalmente.
Eu gostaria de entender o motivo de não funcionar ao acessar o localhost:3000 e quais as possíveis soluções.
Desde já, agradeço pela atenção.