Different concatenation ?

Question

Guys I’m starting programming has little time and I have to register only I want the information typed by the user as the name, email and age appear through an "Alert" after he click on the button "Accept".

My HTML and Javascript files are already "interconnected", I do not know if it is possible to do so, if it is not present me the best way to do this using only HTML and Javascript, and if it is please show me how.

My HTML file

    <label for="nome">Nome:</label>
    <input type="text" name="nome" size="20" maxlength="20" placeholder="Seu nome"/><br><br>
    <label for="senha">Senha:</label>
    <input type="password" name="senha" size="20" maxlength="25" placeholder="Sua senha"/><br><br>
    <input type="button" value="Aceitar" onClick="aceitar()">
    <a class="none" href=javascript:history.back();><input type="button" value="Cancelar"></input></a>

</form>

My JS file

function aceitar(){
    alert("Aqui seria a concatenação")   
 }

On hold
Att,
Lone

Answer 1

Concatenation is simple, just use the +, which is contextual (numerical sum and concatenate strings).

To make life easier, it’s interesting to use a id in the elements:

<label for="nome">Nome:</label>
<input type="text" id="nome" name="nome" maxlength="20" placeholder="Seu nome"/><br><br>
<label for="senha">Senha:</label>
<input type="password" id="senha" name="senha" maxlength="25" placeholder="senha"/><br><br>
<input type="button" value="Aceitar" onClick="aceitar()">

So you can use the document.getElementById to access the fields, and consequently their value with .value

function aceitar() {
    var nome = document.getElementById('nome');   // Aqui pegamos o campo, e não seu valor
    var senha = document.getElementById('senha');
    // em seguida usaremos o .value para pegar o valor dos campos
    alert('Seu nome é ' + nome.value + 'e sua senha é ' + senha.value)

    // no caso especifico, poderiamos ter feito assim tambem:
    // var nome= document.getElementById('nome').value;
    // var senha = document.getElementById('senha').value;
    // alert('Seu nome é ' + nome + 'e sua senha é ' + senha)
}

Have other ways to access elements without id, but the id facilitates reading and simplifies access. We could, for example, have used document.getElementsByName, but a list of nodes is returned instead of a single element, as the names can be repeated in the same document.

See working on CODEPEN.