ContextQMD
Back to Freecodecamp

Step 14

curriculum/challenges/english/blocks/learn-html-by-building-a-cat-photo-app/671141feba228a35cefba82d.md

latest1.6 KB
Original Source

--description--

Turn the existing text cute cats into an anchor element that links to:

https://cdn.freecodecamp.org/curriculum/cat-photo-app/running-cats.jpg

--hints--

There should be a new anchor element in the first p element.

js
assert.exists(document.querySelector('p')?.querySelector('a'));

The anchor text should be cute cats.

js
assert.strictEqual(document.querySelector('a')?.innerText.trim(), "cute cats");

The href attribute of the new anchor element should be https://cdn.freecodecamp.org/curriculum/cat-photo-app/running-cats.jpg.

js
assert.strictEqual(document.querySelector('a')?.href, "https://cdn.freecodecamp.org/curriculum/cat-photo-app/running-cats.jpg");

There should only be one instance of the phrase cute cats in your code.

js
assert.strictEqual(code.indexOf("cute cats"),code.lastIndexOf("cute cats"));

The text of the p element should still be Everyone loves cute cats online!.

js
assert.strictEqual(document.querySelector('p')?.innerText.trim(), "Everyone loves cute cats online!");

--seed--

--seed-contents--

html
<html>
  <body>
    <main>
      <h1>CatPhotoApp</h1>
      <h2>Cat Photos</h2>
      <!-- TODO: Add link to cat photos -->
--fcc-editable-region--
      <p>Everyone loves cute cats online!</p>
--fcc-editable-region--
      <p>See more <a href="https://freecatphotoapp.com">cat photos</a> in our gallery.</p>
      
    </main>
  </body>
</html>