Introducaoaojavascript/introducao.html at main · chritianegozza/Introducaoaojavascript · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Introdução ao javascript</title>
</head>
<body>

    <style>
        #x {
            height: 940px;
            background: lightblue;

        }

        #elem{
            border-radius: 10px;
        }

        body{
            background: pink;
            width: 100%;
            text-align: center;
        }

        ul{
            cursor: pointer;
            color: rgb(201, 39, 39);
        }
    </style>

    <h1 id="t1">Introdução ao javascript</h1>
    <!-- <h2 id="t2"></h2> -->


    <p>Conversão de Km para milha</p>
    <input type="text" id="valorKm" size="1" value="1" > KM
    =<b><span id="resultado"> 1.609</span></b> Milha
    <button type="button" id="botaoCalcular" onclick="calcularKmMilha()">Calcular</button>

    <br>
    <br>
    <br>


    <h2>Laços de Repetição - Loops
    </h2>
    <p>Operações Aritméticas: </p>
    <ul id="listaOperacoes"></ul>
    <br>

    <h2><i>Document Object</i> (DOM)</h2><h2>Modelo por objeto</h2>
    <p>Define:</p>
    <ul id="lista">
      <li>Os <b>elementos</b> HTML como <b>objetos</b></li><p></p>
      <li>As <b>propriedades</b> para acessar os elementos HTML</li><p></p>
      <li>Os <b>eventos</b> dos elementos HTML</li>
      <button>Limpar</button>
    </ul>


   <!--  <form id="formulariologin" onsubmit="bemVindo(); return false;">
        <input type="text" id="nomeUsuario" placeholder="usuário" />
        <input type="password" placeholder="senha">
        <button type="submit">Entrar</button>
    </form> -->

   <!--  <label for="Escolha uma cor de fundo:">Escolha uma cor de fundo:
    <select id="coresFundo" onchange="mudaCorFundo()">
        <option value="white">Branco</option>
        <option value="blue">Azul</option>
        <option value="yellow">Amarelo</option>
        <option value="red">Vermelho</option>
        <option value="pink">Rosa</option>
    </select>
    </label>
    <br>
    <br>
    <!- para aparecer a função imprimir  -->
    <!-- <button onclick="print()">Imprimir</button>

    <br>
    <br> -->

    <!-- The text field -->
   <!--  <input type="text" placeholder="digite seu texto" id="myInput"> -->

    <!-- The button used to copy the text -->

<!-- <button onclick="myFunction()">Copy text</button>
    <br>
    <br>

    <div id='x'>
        <button id='elem'>Click to scroll</button>
      </div> -->

    <!-- <script src="/index.js"></script> -->
    <!-- <script src="/script.js"></script> -->
    <!-- <script src="/operadores.js"></script> -->
    <!-- <script src="/tiposdados.js"></script> -->
    <!-- <script src="/funcao.js"></script> -->
    <!-- <script src="/escopo.js"></script> -->
    <!-- <script src="/objeto.js"></script> -->
    <!-- <script src="/arrays.js"></script> -->
    <!-- <script src="/condicionais.js"></script> -->
    <!-- <script src="/laco.js"></script> -->
    <script src="/dom.js"></script>
</body>
</html>