2.2 KiB
| id | title | challengeType | dashedName |
|---|---|---|---|
| 62dabe2ef403a12d5d295273 | Step 13 | 0 | step-13 |
--description--
Ora che hai trasformato il testo cat photos nell'elemento p in un link, non hai bisogno del secondo link sotto l'elemento p. Elimina l'intero elemento di ancoraggio sotto l'elemento p.
--hints--
Il codice dovrebbe contenere solo un elemento di ancoraggio (a).
assert(document.querySelectorAll('a').length === 1);
L'elemento p dovrebbe avere ancora l'elemento di ancoraggio (a) al suo interno.
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'
);
Il 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\.?$/));
Sotto l'elemento p non dovrebbe esserci il testo cat photos.
const pNextSibling = document.querySelector('p').nextSibling;
assert(
pNextSibling.nodeName === '#text' && !/cat\s*photos/.test(pNextSibling.nodeValue) ||
pNextSibling.nodeName === 'IMG'
);
--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 <a href="https://freecatphotoapp.com">cat photos</a>.</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>