mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-04-12 01:00:13 -04:00

Files

freeCodeCamp's Camper Bot 64697d4ca7 chore(i18n,learn): processed translations (#54988 )

Co-authored-by: Naomi <commits@nhcarrigan.com>

2024-05-28 16:57:56 +09:00

4.6 KiB

Raw Blame History

id, title, challengeType, dashedName

id	title	challengeType	dashedName
62a23c1d505bfa13747c8a9b	Step 13	0	step-13

--description--

Wrap the numbers 0, 100, and 50 in span elements, and wrap those new span elements in strong elements. Gib dann deinen neuen span-Elementen id-Werte von xpText, healthText bzw. goldText.

Your answer should follow this basic structure:

<span class="stat">TEXT <strong><span id="VALUE">TEXT</span></strong></span>

--hints--

Du solltest ein strong-Element in dein erstes .stat-Element hinzufügen.

const stat = document.querySelectorAll('.stat')[0];
const strong = stat?.querySelector('strong');
assert.exists(strong);

Dein erstes neues strong-Element sollte ein span-Element haben.

const stat = document.querySelectorAll('.stat')[0];
const strong = stat?.querySelector('strong');
const span = strong?.querySelector('span');
assert.exists(span);

Dein erstes eingebettetes span-Element sollte die id von xpText haben.

const stat = document.querySelectorAll('.stat')[0];
const strong = stat?.querySelector('strong');
const span = strong?.querySelector('span');
assert.equal(span?.id, 'xpText');

Your first span element should be wrapped around the text 0.

const stat = document.querySelectorAll('.stat')[0];
const strong = stat?.querySelector('strong');
const span = strong?.querySelector('span');
assert.equal(span.innerText.trim(), '0');

The text of your first .stat element should still be XP: 0.

const stat = document.querySelectorAll('.stat')[0];
assert.equal(stat.innerText.trimEnd(), 'XP: 0');

Du solltest ein strong-Element in deinem zweiten .stat-Element hinzufügen.

const stat = document.querySelectorAll('.stat')[1];
const strong = stat?.querySelector('strong');
assert.exists(strong);

Dein zweites neues strong-Element sollte ein span-Element haben.

const stat = document.querySelectorAll('.stat')[1];
const strong = stat?.querySelector('strong');
const span = strong?.querySelector('span');
assert.exists(span);

Your second nested span element should have the id of healthText.

const stat = document.querySelectorAll('.stat')[1];
const strong = stat?.querySelector('strong');
const span = strong?.querySelector('span');
assert.equal(span?.id, 'healthText');

Your second span element should be wrapped around the text 100.

const stat = document.querySelectorAll('.stat')[1];
const strong = stat?.querySelector('strong');
const span = strong?.querySelector('span');
assert.equal(span.innerText.trim(), '100');

The text of your second .stat element should still be Health: 100.

const stat = document.querySelectorAll('.stat')[1];
assert.equal(stat.innerText.trimEnd(), 'Health: 100');

You should add a strong element in your third .stat element.

const stat = document.querySelectorAll('.stat')[2];
const strong = stat?.querySelector('strong');
assert.exists(strong);

Dein neues drittes strong-Element sollte ein span-Element haben.

const stat = document.querySelectorAll('.stat')[2];
const strong = stat?.querySelector('strong');
const span = strong?.querySelector('span');
assert.exists(span);

Your third nested span element should have the id of goldText.

const stat = document.querySelectorAll('.stat')[2];
const strong = stat?.querySelector('strong');
const span = strong?.querySelector('span');
assert.equal(span?.id, 'goldText');

Your third span element should be wrapped around the text 50.

const stat = document.querySelectorAll('.stat')[2];
const strong = stat?.querySelector('strong');
const span = strong?.querySelector('span');
assert.equal(span.innerText.trim(), '50');

The text of your third .stat element should still be Gold: 50.

const stat = document.querySelectorAll('.stat')[2];
assert.equal(stat.innerText.trimEnd(), 'Gold: 50');

--seed--

--seed-contents--

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="./styles.css">
    <title>RPG - Dragon Repeller</title>
    <script src="./script.js"></script>
  </head>
  <body>
    <div id="game">
      <div id="stats">
--fcc-editable-region--
        <span class="stat">XP: 0</span>
        <span class="stat">Health: 100</span>
        <span class="stat">Gold: 50</span>
--fcc-editable-region--
      </div>
      <div id="controls"></div>
      <div id="monsterStats"></div>
      <div id="text"></div>
    </div>
  </body>
</html>

let xp = 0;
let health = 100;
let gold = 50;
let currentWeaponIndex = 0;
let fighting;
let monsterHealth;
let inventory = ["stick"];

4.6 KiB Raw Blame History

--description--

--hints--

--seed--

--seed-contents--

4.6 KiB

Raw Blame History