Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>
1.9 KiB
id, title, challengeType, dashedName, demoType
| id | title | challengeType | dashedName | demoType |
|---|---|---|---|---|
| 5dc174fcf86c76b9248c6eb2 | Step 1 | 0 | step-1 | onLoad |
--description--
HTML elements have an opening and closing tag with content in between.
Here is the basic syntax:
<openingTag>content</closingTag>
The first element you will learn about is the h1 element. The h1 element is a heading element and is used for the main heading of a webpage.
<h1>This is a main heading</h1>
Change the text of the h1 element below from Hello World to CatPhotoApp and watch
the change in the browser preview.
When you are done, press the "Check Your Code" button to see if it's correct.
--hints--
The text CatPhotoApp should be present in the code. You may want to check your spelling.
assert(code.match(/catphotoapp/i));
Your h1 element should have an opening tag. Opening tags have this syntax: <elementName>.
assert(document.querySelector('h1'));
Your h1 element should have a closing tag. Closing tags have a / just after the < character.
assert(code.match(/<\/h1\>/));
You have more than one h1 element. Remove the extra h1 element.
assert(document.querySelectorAll('h1').length === 1);
Your h1 element's text should be CatPhotoApp. You have either omitted the text, have a typo, or it is not between the h1 element's opening and closing tags.
assert(document.querySelector('h1').innerText.toLowerCase() === 'catphotoapp');
You appear to be using a browser extension that is modifying the page. Be sure to turn off all browser extensions.
assert.isAtMost(document.querySelectorAll('script').length, 2);
assert.equal(document.querySelectorAll('style').length, 1);
assert.equal(document.querySelectorAll('link').length, 0);
--seed--
--seed-contents--
<html>
<body>
--fcc-editable-region--
<h1>Hello World</h1>
--fcc-editable-region--
</body>
</html>