2

Então eu estou a fazer um alicativo de pc com o electron que use html, js e css mas quando eu estava a tentar que um valor no html se alterace com o meu js ele não fazia nada mas quando eu colocava o script dentro do html ja funcionava, problema é que eu precisava de ter um ficheiro js so para fazer essas mudanças!.

Meu HTML

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>EComerce App Slime</title>
    <link rel="stylesheet" href="css/index.css">
    <script src="js/index.js"></script>
  </head>
  <body>
    <div id="UpperBar">
      <p class="MASlime">MASlime</p>
      <p class="Home">HOME</p>
    </div>
    <div id="HomePage">
      <div id="Totals">
        <p class="TotalEarnings">Total Earnings</p>
        <p class="TotalOrders">Total Orders</p>
        <p id="Earnings">HIII</p>
      </div>
      <div id="NewOrder">

      </div>
      <div id="Recipe">
        <div id="Small">

        </div>
        <div id="Medium">

        </div>
        <div id="Big">

        </div>
      </div>
    </div>
  </body>
</html>

MEU JS

var element = document.getElementById("Earnings");
element.innerHTML = "100€";
0

1 Resposta 1

1

Você está inserindo o seu <script> dentro do <head>. Tente declarar o seu <script> antes do final da tag <body> conforme abaixo:

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>EComerce App Slime</title>
    <link rel="stylesheet" href="css/index.css">
  </head>
  <body>
    <div id="UpperBar">
      <p class="MASlime">MASlime</p>
      <p class="Home">HOME</p>
    </div>
    <div id="HomePage">
      <div id="Totals">
        <p class="TotalEarnings">Total Earnings</p>
        <p class="TotalOrders">Total Orders</p>
        <p id="Earnings">HIII</p>
      </div>
    </div>

    <!-- 
     ####################
     OS ARQUIVOS DE SCRIPTS VEM AQUI 
     ####################
    -->
    <script src="js/index.js"></script>
  </body>
</html>

E então faça a inserção da sua função JS no arquivo separado index.js

Espero ter ajudado. Se resolveu, contribua marcando como resposta correta. Caso não funcione, detalhe mais algumas opções de informação, por exemplo: o que mostra o console de desenvolvedor do navegador

Sucesso mano!

1
  • 1
    Obrigado, funcionou direitinho! Depois de muita pesquisa a unica coisa que precisava er de vir ao stackoverflow!
    – user132381
    Commented 16/02/2019 às 17:43