Etichetta Javascript

| | | | | | | | | | | | | | | | | |

Il tag etichetta HTML viene utilizzato per definire una didascalia per un elemento in un modulo HTML. Vi si accede con il tage sono collegati a un particolare modulo web. Quando vengono cliccati, consentono all’utente di interagire con un modulo.

Quando crei moduli in HTML, puoi decidere di aggiungere una didascalia ai campi all’interno di un modulo. Ad esempio, potresti volere che un campo modulo che richieda il nome di un cliente abbia la didascalia Nome:.

Ecco dove il codice HTML . Il tag viene utilizzato per definire una didascalia per un elemento di controllo del modulo in un modulo HTML. Ogni etichetta è associata a un elemento specifico in un modulo.

Questo tutorial discuterà, con riferimento ad esempi, come utilizzare il tag etichetta HTML per aggiungere un’etichetta a un modulo. Alla fine della lettura di questo tutorial, sarai un esperto nella creazione di etichette per moduli utilizzando HTML.

Etichetta HTML

Il tag aggiunge un’etichetta a un particolare elemento del modulo in un modulo. Ogni tag etichetta è associato a un elemento del modulo tramite l’attributo HTML for.

Ci sono alcuni motivi per cui utilizzare il tag è importante. Innanzitutto, l’etichetta è associata a un particolare campo modulo in una pagina web. Ciò significa che, se un’utilità per la lettura dello schermo incontra il campo modulo, il contenuto dell’etichetta specificata verrà letto all’utente. Questo, a sua volta, rende il tuo sito web più accessibile.

Inoltre, quando un tag è associato a un campo modulo, l’utente può fare clic sul testo all’interno l’etichetta per attivare il modulo. Ciò rende più facile per l’utente iniziare a interagire con un campo modulo perché non deve fare clic direttamente sull’elemento.

Ad esempio, se hai un elemento checkbox senza tag , l’utente dovrebbe fare clic direttamente all’interno della checkbox per attivare l’elemento. , se hai specificato un tag , l’utente può anche fare clic sull’etichetta per attivare la casella di controllo.

Sintassi dell’etichetta HTML

La sintassi per il tag HTML è la seguente:

L’attributo for viene utilizzato per associare un’etichetta a un particolare elemento . Il valore dell’attributo for deve essere uguale all’attributo di input id utilizzato da un elemento .

Puoi anche inserire un campo all’interno di un’etichetta per associare il modulo di input all’etichetta, invece di utilizzare l’attributo for. La sintassi per questo è la seguente:

Il tag HTML supporta tutti gli attributi globali in HTML. Inoltre, il tag è supportato in tutti i principali browser.

Esempi di etichette HTML

Supponiamo di creare un campo modulo web che richiede un utente per il suo indirizzo e-mail.

Vogliamo che il campo del modulo appaia con l’etichetta Qual ‚Äã‚Äãè il tuo indirizzo e-mail? Ci sono due approcci che potremmo usare per svolgere questo compito: utilizzare l’attributo for o usa un’etichetta nidificata.

for Attribute

Potremmo usare il seguente codice per aggiungere questa etichetta a un campo di input usando il for:

Il nostro codice restituisce quanto segue:


Scomponiamo il nostro codice.

Nella prima riga, abbiamo utilizzato un tag da aggiungere l’etichetta Qual ‚Äã‚Äãè il tuo indirizzo email? al nostro modulo web. Abbiamo specificato l’attributo for e gli abbiamo assegnato il valore email_address, che collega l’etichetta al nostro campo modulo con l’id email_address.

Alla fine della riga, abbiamo utilizzato un tag
per inserire una riga orizzontale vuota nel nostro codice.

Nella riga successiva, abbiamo creato un campo di input di testo utilizzando il tag . Questo campo di input ha l’id email_address, che utilizziamo per associare il campo di input a un’etichetta.

Etichetta nidificata

In alternativa, possiamo utilizzare un tag nidificato in un tag per creare la nostra etichetta. Ecco il codice che utilizzeremmo per creare un’etichetta nidificata per il nostro modulo web sopra:

Il nostro codice restituisce:

Il nostro modulo è visivamente lo stesso del nostro primo esempio. Tuttavia, in questo esempio, non usiamo il for attributo per collegare la nostra etichetta al nostro modulo. Invece, posizioniamo il nostro tag all’interno di un tag , che collega i due tag HTML insieme.

Etichetta HTML Accessibilità

Ci sono alcune note sull’accessibilità che dovresti tenere a mente quando stai progettando un’etichetta usando il tag .

Prima, le intestazioni non deve essere inserito all’interno di un tag . Questo perché gli elementi di intestazione all’interno dei tag possono interferire con le tecnologie di lettura dello schermo e altri strumenti utilizzati per promuovere l’accessibilità al Web. Quindi, se desideri aggiungere un’intestazione a un’etichetta del modulo, dovresti farlo al di fuori di qualsiasi tag .

Secondo, non dovresti inserire alcun pulsante o collegamenti all’interno di un tag . Questo perché gli elementi interattivi all’interno di un tag possono creare confusione per l’utente nel capire come funziona il modulo web. Se un pulsante è disponibile all’interno di un , ad esempio, l’utente potrebbe pensare di dover fare clic sul pulsante per interagire con il modulo web.

Conclusione

Il tag HTML viene utilizzato per creare etichette di moduli.Queste etichette sono collegate a un particolare modulo web e, quando cliccato, consenti all’utente di interagire con un modulo.

Questo tutorial ha illustrato, con riferimento ad esempi, come utilizzare l’HTML tag per aggiungere etichette a un elemento del modulo, nonché problemi di accessibilità associati al tag . Ora hai le conoscenze necessarie per iniziare a lavorare con le etichette in HTML come un professionista!