3.3 KiB
| id | title | challengeType | dashedName |
|---|---|---|---|
| 5efb2c990dc218d6c85f89b2 | Paso 42 | 0 | step-42 |
--description--
A pesar de que hayas añadido tu botón debajo del elemento input de tipo texto, estos aparecen juntos en la página. Esto se debe a que los elementos input y button son elementos inline, los cuales no aparecen en una nueva línea.
Anteriormente, aprendiste que el botón envía el formulario por defecto, pero puedes añadir el atributo type con el valor submit para hacerlo más claro. Adelante, hazlo para especificar dónde se debe enviar el formulario al hacer clic en el botón.
--hints--
Tu elemento button debe tener una etiqueta de apertura. Las etiquetas de apertura tienen esta sintaxis: <elementName>.
assert(document.querySelector('button'));
Tu elemento button debe tener una etiqueta de cierre. Las etiquetas de cierre tiene una / después del carácter <.
assert(code.match(/<\/button\>/));
Tu elemento button no tiene un atributo type. Comprueba que hay un espacio después del nombre de la etiqueta de apertura.
assert($('button')[0].hasAttribute('type'));
Tu elemento button debe tener un atributo type con el valor submit. Probablemente no has añadido el valor o tienes un error tipográfico. Recuerda que los valores de los atributos deben estar entre comillas.
assert(
$('button')[0]
.getAttribute('type')
.match(/^submit$/i)
);
Aunque al atributo type del elemento button le hayas dado el valor submit, se recomienda siempre poner el valor de un atributo entre comillas.
assert(!/\<\s*button\s+type\s*=\s*submit/i.test(code));
--seed--
--seed-contents--
<html>
<body>
<h1>CatPhotoApp</h1>
<main>
<section>
<h2>Cat Photos</h2>
<!-- TODO: Add link to cat photos -->
<p>Click here to view more <a target="_blank" href="https://freecatphotoapp.com">cat photos</a>.</p>
<a href="https://freecatphotoapp.com"><img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>
</section>
<section>
<h2>Cat Lists</h2>
<h3>Things cats love:</h3>
<ul>
<li>cat nip</li>
<li>laser pointers</li>
<li>lasagna</li>
</ul>
<figure>
<img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/lasagna.jpg" alt="A slice of lasagna on a plate.">
<figcaption>Cats <em>love</em> lasagna.</figcaption>
</figure>
<h3>Top 3 things cats hate:</h3>
<ol>
<li>flea treatment</li>
<li>thunder</li>
<li>other cats</li>
</ol>
<figure>
<img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/cats.jpg" alt="Five cats looking around a field.">
<figcaption>Cats <strong>hate</strong> other cats.</figcaption>
</figure>
</section>
<section>
<h2>Cat Form</h2>
<form action="https://freecatphotoapp.com/submit-cat-photo">
<input type="text" name="catphotourl" placeholder="cat photo URL" required>
--fcc-editable-region--
<button>Submit</button>
--fcc-editable-region--
</form>
</section>
</main>
</body>
</html>