2.1 KiB
| id | title | challengeType | dashedName |
|---|---|---|---|
| 5dfa22d1b521be39a3de7be0 | Step 12 | 0 | step-12 |
--description--
Nello step precedente hai trasformato le parole link to cat pictures in un link inserendole tra un tag di apertura e un tag di chiusura di ancoraggio (a). Puoi fare lo stesso con le parole in un elemento, come un elemento p.
Nel testo dell'elemento p, trasforma le parole cat photos in un link a https://freecatphotoapp.com posizionando queste parole tra un tag di apertura e un tag di chiusura di ancoraggio (a).
--hints--
Dovresti annidare un nuovo elemento di ancoraggio (a) dentro l'elemento p.
assert($('p > a').length);
Il valore dell'attributo href del link dovrebbe essere https://freecatphotoapp.com. Hai omesso il valore di href o hai un refuso.
const nestedAnchor = $('p > a')[0];
assert(
nestedAnchor.getAttribute('href') === 'https://freecatphotoapp.com'
);
Il testo del link dovrebbe essere cat photos. Hai omesso il testo o hai un refuso.
const nestedAnchor = $('p > a')[0];
assert(
nestedAnchor.innerText.toLowerCase().replace(/\s+/g, ' ') === 'cat photos'
);
Dopo aver annidato l'elemento di ancoraggio (a), l'unico contenuto dell'elemento p visibile nel browser dovrebbe essere Click here to view more cat photos. Controlla il testo, la spaziatura o la punteggiatura sia dell'elemento p che dell'elemento di ancoraggio annidato.
const pText = document
.querySelector('p')
.innerText.toLowerCase()
.replace(/\s+/g, ' ');
assert(pText.match(/click here to view more cat photos\.?$/));
--seed--
--seed-contents--
<html>
<body>
<h1>CatPhotoApp</h1>
<main>
<h2>Cat Photos</h2>
<!-- TODO: Add link to cat photos -->
--fcc-editable-region--
<p>Click here to view more cat photos.</p>
<a href="https://freecatphotoapp.com">link to cat pictures</a>
--fcc-editable-region--
<img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back.">
</main>
</body>
</html>