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

2.9 KiB

id title challengeType dashedName
62a23cb9bc467a147516b500 Крок 5 0 step-5

--description--

Всередині свого елемента #controls створіть три елементи button. Перший повинен мати id зі значенням button1 та текст Go to store. Другий повинен мати id зі значенням button2 та текст Go to cave. Третій повинен мати id зі значенням button3 та текст Fight dragon.

--hints--

Ви повинні додати три елементи button до свого елемента #controls.

const buttons = document.querySelectorAll('#controls > button');
assert.exists(buttons);
assert.equal(buttons.length, 3);

Ваша перша кнопка повинна мати id зі значенням button1.

const buttons = document.querySelectorAll('#controls > button');
const button1 = buttons[0];
assert.equal(button1.id, 'button1');

Ваша перша кнопка повинна мати текст Go to store.

const buttons = document.querySelectorAll('#controls > button');
const button1 = buttons[0];
assert.equal(button1.innerText, 'Go to store');

Ваша друга кнопка повинна мати id зі значенням button2.

const buttons = document.querySelectorAll('#controls > button');
const button2 = buttons[1];
assert.equal(button2.id, 'button2');

Ваша друга кнопка повинна мати текст Go to cave.

const buttons = document.querySelectorAll('#controls > button');
const button2 = buttons[1];
assert.equal(button2.innerText, 'Go to cave');

Ваша третя кнопка повинна мати id зі значенням button3.

const buttons = document.querySelectorAll('#controls > button');
const button3 = buttons[2];
assert.equal(button3.id, 'button3');

Ваша третя кнопка повинна мати текст Fight dragon.

const buttons = document.querySelectorAll('#controls > button');
const button3 = buttons[2];
assert.equal(button3.innerText, 'Fight dragon');

--seed--

--seed-contents--

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="./styles.css">
    <title>RPG - Dragon Repeller</title>
</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>
--fcc-editable-region--
        <div id="controls">

        </div>
--fcc-editable-region--
        <div id="monsterStats"></div>
        <div id="text"></div>
    </div>
</body>
</html>