Índice

Botón de acción

En materia de botones (button), existe también la etiqueta <button> ... </button>. Esta etiqueta permite ejecutar, al hacer clic en el botón, una acción específica definida por el diseñador del sitio web, generalmente mediante algún código de JavaScript. Ofrece igualmente la posibilidad de realizar el envío y la anulación del formulario (submit y reset).

Por otro lado, esta etiqueta <button> presenta la ventaja de tener una etiqueta de apertura y otra de cierre. De este modo es posible incluir texto, imágenes o incluso contenido HTML. Destaquemos también que esta etiqueta <button> no tiene por qué estar anidada obligatoriamente en un formulario <form> y puede usarse en múltiples contextos.

Todo esto la convierte en una etiqueta polivalente y justifica su éxito entre los desarrolladores. 

Ejemplo

Al hacer clic en el botón, se abre una ventana de alerta:

<!DOCTYPE html> 
<html lang="es"> 
<head> 
   <title>Html5</title> 
   <meta charset="UTF-8"> 
</head> 
<body> 
<button onclick="alert(’Acción JavaScript’)"> 
Haga clic aquí</button> 
</body> 
</html>
images/CAP09IMG17.png

Comentarios

  • Esta etiqueta es perfectamente compatible entre los diferentes navegadores.

  • La etiqueta <button> tiene una etiqueta de cierre: </button>.

  • El texto ...