2.0 KiB
| id | title | challengeType | dashedName |
|---|---|---|---|
| 5dfa22d1b521be39a3de7be0 | Passo 12 | 0 | step-12 |
--description--
Transforme as palavras cat photos localizadas dentro do elemento p em um link usando o mesmo valor para o atributo href do link abaixo do elemento p. O elemento p deve mostrar o mesmo texto no navegador, mas as palavras cat photos agora devem ser um link. Certifique-se de remover o elemento a com o texto cat photos na linha abaixo do elemento p.
--hints--
O código deve conter apenas um elemento de âncora (a). Remova os elemento elementos de âncora adicionais.
assert(document.querySelectorAll('a').length === 1);
O elemento de âncora (a) deve estar aninhado dentro do elemento p.
assert($('p > a').length);
O texto do link deve ser cat photos. Você omitiu o texto ou tem um erro de digitação.
const nestedAnchor = $('p > a')[0];
assert(
nestedAnchor.getAttribute('href') === 'https://freecatphotoapp.com' &&
nestedAnchor.innerText.toLowerCase().replace(/\s+/g, ' ') === 'cat photos'
);
Após aninhar o elemento de âncora (a), o único conteúdo do elemento p visível no navegador deve ser Click here to view more cat photos. Verifique o texto novamente em termos de espaçamento e pontuação, tanto do elemento p quanto do elemento de âncora aninhado.
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">cat photos</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>