Html <input> atributos de la etiqueta | Explicado
- Tipo de atributo
- Atributo de nombre
- Atributo Min y Max
- Atributo de enfoque automático
- Atributo discapacitado
- Atributo de marcador de posición
- Atributo de lectura
- Atributo requerido
- Atributo múltiple
- Atributo de tamaño
- Atributo automático
Esta redacción presentará una descripción completa de todos los atributos mencionados anteriormente. Avanzemos!
Tipo de atributo
Como el nombre en sí mismo sugiere el atributo de tipo en la etiqueta determina el tipo de entrada, el valor por defecto del atributo de tipo es texto. Podemos asignar diferentes valores al atributo de tipo, como contraseña, correo electrónico, etc. La sintaxis básica del atributo de tipo se muestra en la siguiente figura:
Se especifican diferentes valores para el atributo de tipo en la etiqueta. El comportamiento del atributo de tipo será diferente para diferentes valores.
Atributo de nombre
Especifica el nombre del elemento de entrada, lo siguiente será la sintaxis básica del atributo de nombre:
No afectaría la salida, en su lugar, el atributo de nombre le indica al servidor sobre el campo de entrada.
Atributo Min y Max
Estos atributos se utilizan para especificar los valores mínimos y máximos del elemento de entrada. El fragmento a continuación muestra la sintaxis de los atributos MIN y Max:
Atributo de enfoque automático
El atributo de enfoque automático determina que un elemento debe obtener enfoque automático cuando la página se carga y la figura a continuación muestra la sintaxis del atributo de enfoque automático:
Atributo discapacitado
El atributo deshabilitado nos permite deshabilitar un elemento, en tal caso, el usuario no podría usar o hacer clic en ese campo:
Ejemplo
Consideremos el código dado a continuación que implementa todos los atributos mencionados anteriormente para diferentes campos:
El fragmento anterior crea múltiples campos de entrada, el atributo de enfoque automático está habilitado en el primer campo, por lo que cada vez que cargamos la página, el cursor apuntará a ese campo. No podríamos hacer clic en el segundo campo porque contiene el atributo deshabilitado. El tercer campo de entrada es un campo de tipo de número y especificamos atributos MIN y MAX en él, por lo que solo tomará el valor entre 20 y 60:
La salida verifica que todos los atributos funcionen correctamente.
Atributo de marcador de posición
Proporciona una pista sobre el valor esperado del campo de entrada. La sintaxis básica del atributo de marcador de posición será la siguiente:
Cualquier cosa que especifiquemos dentro del marcador de posición se mostrará como una pista como se muestra a continuación:
Atributo de lectura
Determina que el campo es de solo lectura, lo que significa que el campo no se puede modificar. La sintaxis del atributo de solo lectura se muestra en la siguiente figura:
Especificamos value = "Michael" y habilitamos el atributo de solo lectura. Como resultado, no podríamos cambiar el valor de ese campo de entrada:
Atributo requerido
El atributo requerido determina que el formulario no se puede enviar si no se llena el campo de entrada. La sintaxis básica del atributo requerido se muestra en el siguiente fragmento:
Si hacemos clic en el botón Enviar sin llenar el campo de entrada, obtendremos el siguiente resultado:
Atributo múltiple
Nos permite ingresar múltiples valores y se usa principalmente con el tipo de entrada "archivo" donde permite que un usuario elija múltiples archivos. El siguiente fragmento de código muestra la sintaxis del atributo "múltiple":
El fragmento arriba genera la siguiente salida:
Atributo de tamaño
Se utiliza para establecer el tamaño (ancho) del campo de entrada, la sintaxis del atributo de tamaño se muestra en el fragmento de abajo dados:
El tamaño predeterminado de los campos de entrada es de 20 caracteres y modificamos el tamaño del primer campo de entrada como 35, por lo que generará la siguiente salida:
Atributo automático
Habilitar el atributo de autocompletar permite que un navegador predice y comple automáticamente el campo de entrada. El fragmento dado a continuación muestra cómo usar el atributo automático en la etiqueta de entrada:
El código anterior-snippet muestra la siguiente salida:
La salida verificó que si autocomplete = "encendido", entonces el navegador sugiere los datos ya ingresados.
Conclusión
Los atributos de la etiqueta se utilizan para controlar el comportamiento de los campos de entrada del formulario e.gramo. El atributo de tipo determina el tipo de entrada, el atributo de enfoque automático se utiliza para centrarse en el elemento específico en la carga de la página. Habilitar el atributo de autocompletar proporciona datos ya ingresados como sugerencias y múltiples atributos nos permite agregar múltiples archivos. Este artículo demostró una guía detallada para la comprensión profunda de los atributos de la etiqueta HTML.