los - formularios html css
¿Son válidas las etiquetas html de botones fuera de un formulario? (2)
Me acabo de dar cuenta de que, en SoundCloud, los botones de "acción" en una pista (como, reenviar, etc.) son todas etiquetas de botones html. Además, no están dentro de un formulario ni se unen a un formulario a la html5 ni envían un formulario (aparentemente están siendo manejados mediante javascript). Es este HTML válido? ¿Puede un botón existir sin una forma? ¿O eso solo hace que estos botones divs cliqueables? ¿Y qué tan válido / no válido sería para los lectores de pantalla?
Sí. Desde hace mucho tiempo.
De whatwg.org :
Contextos en los que se puede usar este elemento:
Donde se espera contenido de fraseo
En la era de ajax, la mayoría de las entradas no se envían simplemente enviando un formulario. Y la mayoría de los botones solo se usan para ejecutar una acción al hacer clic mientras se usa un widget reconocible.
Un elemento de button
es válido en cualquier lugar del cuerpo del documento donde puede aparecer el marcado de nivel de texto. Tal elemento no necesita tener ninguna relación con un elemento de form
. La referencia actualmente autorizada es la especificación HTML 4.01 , y las reglas formales están en la DTD, pero puede tomar un atajo y usar el Validador de marcado W3C para verificar si un documento es válido.
Cuando no está asociado con un formulario, un elemento de button
no es muy diferente de un elemento span
(en lugar de div
, que es de nivel de bloque por defecto), pero el button
tiene un renderizado predeterminado especial. Los navegadores y el software de asistencia también pueden tratar el button
como especial, y es más seguro usar el button
solo para elementos que se supone que deben activar alguna acción cuando se hace clic. Por el contrario, dichos elementos a menudo se representan mejor con el marcado de button
, aunque también se pueden crear elementos visuales tipo botón de otras maneras (imágenes o CSS, principalmente).
Fuera de un formulario, un elemento de button
tiene el type=button
por defecto (y ese es normalmente el único type
sensible para él). Esto significa que solo puede tener un efecto a través de JavaScript. Esto no lo invalida de ninguna manera. Sin embargo, puede considerar generar dichos botones a través de JavaScript en lugar de tenerlos como contenido HTML estático, de modo que cuando el scripting esté desactivado, no habrá un botón (válido, pero) confuso que no haga nada.
Para abordar preguntas aclaratorias en el comentario a continuación:
Un button type=button
elemento de button type=button
es similar al input type=button
; la diferencia es que este último no tiene contenido pero toma el texto que se muestra en el botón del atributo de value
, mientras que el button
tiene contenido que puede ser "rico" (con marcado).
Para cualquiera de los elementos, si usarlos provoca una acción del servidor (generalmente, a través de una llamada Ajax), entonces podemos preguntar cómo funciona la página con JavaScript desactivado. Pero esta pregunta puede ser irrelevante (tal vez la página es una aplicación que se supone que se ejecuta con JavaScript de todos modos), y en cualquier caso no hay nada formalmente mal con la idea.
¿Por qué existen? Por comodidad del autor y por razones heredadas, diría. Del mismo modo, uno podría preguntarse por qué HTML tiene atributos de evento, cuando posiblemente no pueden funcionar sin secuencias de comandos del lado del cliente y puede asignar controladores de eventos a elementos en JavaScript. Pero en los primeros días, eso no era posible, e incluso en la actualidad, podría ser más conveniente usar el elemento button
o el atributo onclick
que hacer cosas en JavaScript (y, para hacer que un elemento parezca un botón, CSS) . También está el hecho de que el button
y input type=button
crean una apariencia dependiente del navegador para los elementos, y podría argumentarse que para la mayoría de los usuarios, todo lo que tiene el estilo predeterminado de botones de su navegador se percibe como un botón.