name HTML attribuut

Was vereist om een mogelijke doellocatie op een pagina te definiëren. In HTML 4.01 konden id en name beide op <a> worden gebruikt, zolang ze dezelfde waarde hadden.

Dit attribuut maakt het mogelijk om meerdere <details>-elementen met elkaar te verbinden, waarbij er slechts één tegelijk open is. Hierdoor kunnen ontwikkelaars eenvoudig UI-functies zoals accordeons maken zonder scripting.

Het name-attribuut geeft een groepsnaam op — geef meerdere <details>-elementen dezelfde name-waarde om ze te groeperen. Slechts één van de gegroepeerde <details>-elementen kan tegelijk open zijn — het openen van één ervan zorgt ervoor dat een ander sluit. Als aan meerdere gegroepeerde <details>-elementen het open-attribuut is gegeven, wordt alleen het eerste element in de brontekstvolgorde geopend weergegeven.

De naam die aan de groep is gekoppeld.

Een tekenreeks die een naam voor het invoerbesturingselement opgeeft. Deze naam wordt samen met de waarde van het besturingselement verzonden wanneer de formuliergegevens worden verzonden.

Beschouw name als een verplicht attribuut (ook al is het dat technisch niet). Als een invoerveld geen name heeft opgegeven, of name is leeg, wordt de waarde van het invoerveld niet met het formulier verzonden! (Uitgeschakelde besturingselementen, niet-aangevinkte keuzerondjes, niet-aangevinkte selectievakjes en reset-knoppen worden ook niet verzonden.)

Er zijn twee bijzondere gevallen:

1. _charset_: als deze naam gebruikt wordt voor een <input>-element van het type hidden, wordt de value van het invoerveld automatisch door de user agent ingesteld op de tekencodering die gebruikt wordt om het formulier te verzenden.
2. isindex: om historische redenen is de naam isindex niet toegestaan.

Het name-attribuut zorgt voor uniek gedrag bij keuzerondjes.

Slechts één keuzerondje in een gelijknamige groep keuzerondjes kan tegelijk aangevinkt zijn. Het selecteren van een willekeurig keuzerondje in die groep deselecteert automatisch het momenteel geselecteerde keuzerondje in dezelfde groep. De waarde van dat ene aangevinkte keuzerondje wordt samen met de naam verzonden als het formulier wordt verzonden.

Bij het tabben door een reeks gelijknamige keuzerondjes krijgt, als er één is aangevinkt, dat aangevinkte rondje focus. Als ze niet in de brontekstvolgorde bij elkaar staan en één van de groep is aangevinkt, begint het tabben in de groep zodra het eerste element van de groep bereikt wordt, waarbij alle niet-aangevinkte rondjes worden overgeslagen. Met andere woorden: als er één is aangevinkt, slaat tabben de niet-aangevinkte keuzerondjes in de groep over. Als er geen is aangevinkt, krijgt de keuzerondjegroep focus wanneer het eerste rondje met dezelfde naam wordt bereikt.

Zodra een van de keuzerondjes in een groep focus heeft, kun je met de pijltjestoetsen door alle keuzerondjes met dezelfde naam navigeren, zelfs als de keuzerondjes niet bij elkaar staan in de brontekstvolgorde.

Wanneer een invoerelement een name krijgt, wordt die naam een eigenschap van de HTMLFormElement.elements-eigenschap van het bijbehorende formulierelement. Als je een invoerveld hebt waarvan name is ingesteld op guest, en een ander waarvan name is ingesteld op hat-size, kan de volgende code gebruikt worden:

let form = document.querySelector("form");

let guestName = form.elements.guest;
let hatSize = form.elements["hat-size"];

Wanneer deze code is uitgevoerd, is guestName het HTMLInputElement voor het guest-veld, en hatSize het object voor het hat-size-veld.

De naam van de slot. Een genoemde slot is een <slot>-element met een name-attribuut, terwijl een ongenoemde slot geen name-attribuut heeft, en de naam standaard de lege tekenreeks is.

Wanneer een shadow-root genoemde slot-toewijzing gebruikt, worden de kindelementen op het hoogste niveau van de host weergegeven in slots waarvan de naam overeenkomt met hun slot-attribuut. Slotnamen moeten uniek zijn per shadow-root: als u twee slots met dezelfde naam heeft, worden alle elementen met een overeenkomend slot-attribuut weergegeven in de eerste slot. Alle kindelementen op het hoogste niveau die geen slot-attribuut hebben, worden weergegeven in de eerste ongenoemde <slot>, ook wel de standaardslot genoemd. De name heeft geen effect als de shadow-root handmatige slot-toewijzing gebruikt.

Zie voor meer informatie shadowrootslotassignment op het <template>-element en Element.attachShadow().