freeCodeCamp/curriculum/challenges/portuguese/15-javascript-algorithms-an.../learn-basic-javascript-by-b.../62a255dae245b52317da824a.md

3.0 KiB

id title challengeType dashedName
62a255dae245b52317da824a Passo 16 0 step-16

--description--

Uma das ferramentas mais poderosas é o console do desenvolvedor. Dependendo do navegador, ele pode ser aberto pressionando F12 ou Ctrl+Shift+I. Você também pode clicar no botão "Console" acima da janela de pré-visualização para ver o console embutido. O console do desenvolvedor incluirá erros produzidos pelo código, mas você também pode usá-lo para ver valores de variáveis no código, o que é útil para depuração.

Adicione a linha console.log("Hello World"); entre as tags script e, em seguida, clique no botão "Console" para abrir o console, e você deve ver ali o texto Hello World.

Observe como a linha termina com ponto e vírgula. É prática comum em JavaScript encerrar as linhas de código com ponto e vírgula.

--hints--

Você deve adicionar uma linha console.log("Hello World"); no código. Não se esqueça do ponto e vírgula.

assert.match(code, /console\.log\("Hello World"\);/);

A linha console.log("Hello World"); deve estar entre as tags script.

assert.match(code, /<script>\s*console\.log\("Hello World"\);\s*<\/script>/);

--seed--

--seed-contents--

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="./styles.css">
    <title>RPG - Dragon Repeller</title>
--fcc-editable-region--
    <script>

    </script>
--fcc-editable-region--
</head>
<body>
    <div id="game">
        <div id="stats">
            <span class="stat">XP: <strong><span id="xpText">0</span></strong></span>
            <span class="stat">Health: <strong><span id="healthText">100</span></strong></span>
            <span class="stat">Gold: <strong><span id="goldText">50</span></strong></span>
        </div>
        <div id="controls">
            <button id="button1">Go to store</button>
            <button id="button2">Go to cave</button>
            <button id="button3">Fight dragon</button>
        </div>
        <div id="monsterStats">
            <span class="stat">Monster Name: <strong><span id="monsterName"></span></strong></span>
            <span class="stat">Health: <strong><span id="monsterHealth"></span></strong></span>
        </div>
        <div id="text">
            Welcome to Dragon Repeller. You must defeat the dragon that is preventing people from leaving the town. You are in the town square. Where do you want to go? Use the buttons above.
        </div>
    </div>
</body>
</html>
body {
    background-color: darkblue;
}

#text {
    background-color: black;
    color: white;
    padding: 10px;
}

#game {
    max-width: 500px;
    max-height: 400px;
    background-color: lightgray;
    color: white;
    margin: 0 auto;
    padding: 10px;
}

#controls, #stats {
    border: 1px solid black;
    padding: 5px;
    color: black;
}

#monsterStats {
    display: none;
    border: 1px solid black;
    padding: 5px;
    color: white;
    background-color: red;
}

.stat {
    padding-right: 10px;
}