Como fazer escolhas com se no seu jogo HTML5

Às vezes você vai precisar do seu código do jogo HTML5 para tomar decisões ou escolhas. Por exemplo, se alguém famoso digitado seu nome em seu site, você pode querer criar uma saudação para eles personalizado.

Como você pode ver, o programa olha para a entrada no comportamento caixa de texto e as mudanças com base no valor do campo de texto.

O código é bastante semelhante ao código no hiUser página. A única diferença é a forma como a função é escrita. Aqui está o checkname () função chamada em ifElse.html:

 checkname function () // a partir ifElse.htmllblOutput = document.getElementById ( "lblOutput") - txtInput = document.getElementById ( "txtInput") - username = txtInput.value-se (nome == "Tim Berners-Lee") { lblOutput.innerHTML = "Obrigado por inventar HTML!" -} else {lblOutput.innerHTML = "Eu te conheço?" -} // fim do if} // função de final

Alterar a saudação do jogo com se

Esse código usa uma ideia importante chamado de condição dentro de uma construção de uma chamada E se declaração. Aqui é o que está acontecendo:

1. Configurar a página web, como de costume.

   O código HTML tem elementos chamados lblOutput e txtInput. Ele também tem um botão que chama checkname () quando é clicado.

2. Criar variáveis ​​para elementos de página importantes.

   Você está recebendo dados de txtInput e alterando o código HTML em lblOutput, assim criar variáveis ​​para estes dois elementos.

3. Obter userName a partir de txtInput.

   Use o txtInput.value truque para obter o valor do elemento de entrada chamada txtInput e colocá-lo na variável userName.

4. Configurar uma condição.

   A chave para este programa é um elemento especial chamado condição - uma expressão que pode ser avaliada como verdade ou falso. As condições são muitas vezes (como neste caso) comparações. Note-se que de igual duplos assinar (==) É usado para representar a igualdade. Neste exemplo, esta pergunta se a userName variável é igual ao valor "Tim Berners-Lee".

5. Coloque a condição num E se estrutura.

   o E se instrução é uma de uma série de construções de programação que utilizam condições. Ele contém a palavra-chave E se seguido de uma condição (em parênteses). Se a condição for verdade, todo o código no seguinte conjunto de chaves é executado.

6. Escrever código para executar se a condição for verdade.

   Crie um conjunto de chaves onduladas depois da condição. Qualquer código dentro destas chaves é executada se a condição é verdade. Certifique-se de recuar seu código e usar a cinta squiggle direita (}) Para terminar o bloco de código. Neste exemplo, há uma saudação especial a Tim Berners-Lee.

7. construir uma outro cláusula.

   Você pode construir um E se declaração com um único bloco de código, mas muitas vezes você deseja que o código para fazer outra coisa se a condição for falso. Use o outro construir para indicar que você terá um segundo bloco de código que só será executado se a condição for falso.

8. Escrever o código para acontecer quando a condição é falso.

   O bloco de código após a outro cláusula executa somente se a condição for falsa. Neste exemplo em particular, há uma saudação para todos, exceto Tim Berners-Lee.

Os sabores diferentes de se em seu jogo

Se as instruções são extremamente poderosos, e há um número de variações. Você pode realmente ter um, dois, ou qualquer número de ramos. Você pode escrever código como este:

if (nome == "Tim Berners-Lee") {lblOutput.innerHTML = "Obrigado por inventar HTML"} // fim se

Com esta estrutura, a saudação ocorre se userName é "Tim Berners-Lee" e nada acontece se o userName é qualquer outra coisa. Você também pode usar o if-else estrutura (esta é a forma usada no código real):

if (nome == "Tim Berners-Lee") {lblOutput.innerHTML = "Obrigado por inventar HTML!" -} else {lblOutput.innerHTML = "Eu te conheço?" -} // fim se

mais uma alternativa permite comparar como muitos resultados que você deseja, adicionando novas condições:

if (nome == "Tim Berners-Lee") {lblOutput.innerHTML = "Obrigado por inventar HTML!" -} else if (nome == "Al Gore") {lblOutput.innerHTML = "Obrigado por inventar a Internet" - } else if (nome == "Hakon Wium Lie") {lblOutput.innerHTML = "Obrigado por inventar CSS" -} else {lblOutput.innerHTML = "Eu te conheço?" -} // fim se

operadores condicionais

o == verificações do operador para ver se dois valores são idênticos, mas, como mostra a Tabela 3-1, javascript suporta um número de outros operadores também.

Operador	Significado
a == b	a é igual a b.
uma lt; b	a é menor do que b.
a> b	a é maior do que b.
uma lt; = b	a é menor do que ou igual a b.
a> = b	a é maior que ou igual a b.
um! = b	A não é igual a b.

Se você está vindo de uma outra linguagem de programação como Java, C ++, ou PHP, você pode se perguntar como comparações de cadeias funcionam porque eles exigem que os operadores diferentes em línguas. javascript usa exatamente os mesmos operadores de comparação para tipos de dados, por isso não há necessidade de aprender diferentes operadores.