The <input> Element

Technical Summary

Structure / Content model

Item	Specification summary
Context	Where phrasing content is expected
Content model	Nothing
Tag omission	No end tag; input is a void element
Basic meaning	A typed data field; the exact meaning depends on the type state

An input therefore cannot contain text or child elements that provide its label. Explanatory content is associated through surrounding elements such as label.

type states and variants

Example state	Data meaning	Associated control
Hidden	An arbitrary string	No visual control
Text / Search	Text without line breaks	Text or search control
Email / URL / Password	Email address, absolute URL, or sensitive text	Text control; Password obscures entry
Date / Month / Week / Time	Date or time values without a time zone	Date or time control
Number / Range	A number; Range also expresses that the exact value may not matter	Text, spinner, slider, or similar control
Checkbox / Radio	A selection from a set, or an enumerated value	Checkbox or radio button
File / Submit / Image / Reset / Button	Files, submission, image coordinates, reset, or button behavior	The control associated with that state

This is not only a visual switch. The Standard defines, for each state, which content attributes, IDL attributes, methods, and events apply.

<input type="email" name="address">
<input type="checkbox" name="topics" value="html">
<input type="date" name="published-on">

type as an enumerated attribute

type does not treat every arbitrary string as a new semantic type. It selects a state from defined keywords. When the attribute is missing or invalid, the input uses the Text state. An unknown value does not create a custom input state.

Condition	Selected state	Verification point
type omitted	Text	Ordinary one-line text input
Defined keyword	The corresponding state	Check that state's applicability table and section
Unknown or invalid value	Text	The value is not interpreted as a new state

Form association / Categories

input is a form-associated element. Its categories differ by type state.

State	Main categories / association
Non-Hidden	Flow, phrasing, interactive, listed, labelable, submittable, resettable, form-associated, and palpable
Hidden	Flow, phrasing, listed, submittable, resettable, and form-associated; not interactive, labelable, or palpable

The same element name does not mean that every state has the same UI, accessibility mapping, events, or form-processing behavior.

Attributes / Constraint validation

• name participates in the name used for form submission and in the form.elements API.
• value, checked, and files expose state-dependent values or state.
• required, pattern, min, max, step, minlength, and maxlength have state-specific applicability and validation rules.
• disabled, readonly, autocomplete, and list do not have identical applicability across all states.

Whether a control participates in constraint validation cannot be determined from an attribute-name list alone. The state, conditions such as disabled or readonly, value type, and form-submission processing must be considered together.

const field = document.querySelector('input');
field.type;
field.value;
field.validity;
field.checkValidity();

Relationship with label

For labelable states, an explicit association can pair a label's for with the input's id. An implicit association can also place the input inside the label. A placeholder is not a replacement for a label.

<label for="email">Email address</label>
<input id="email" name="email" type="email" autocomplete="email">

DOM interface

The input element is exposed as HTMLInputElement. In addition to common value and type members, it exposes state-dependent APIs such as checked, files, valueAsDate, valueAsNumber, validity, labels, and stepUp().

Fact / Evidence

Key facts are mapped to their conditions, review status, and evidence locations. Unresolved scope remains visible in the Coverage section below.

Evidence

1. HTML Standard: The input element — semantics, categories, content model, attributes, and DOM interface
2. HTML Standard: States of the type attribute — type states, applicability, and state-specific processing
3. HTML Standard: The label element — association with labelable controls
4. HTML Standard: Form control infrastructure — form association, constraint validation, and shared form-control behavior

Implementation Evidence

Implementation observations are recorded separately from normative claims. Unrun items are not treated as reviewed.

Shared fixture / record: Inside <form id="evidence-form" method="get">, the fixture includes an input with no type, explicit for/id association, implicit association with an input inside a label, required, disabled, and submit plus type-omitted button controls. Environment: Chrome 152.0.0.0 (Windows NT 10.0) / checked 2026-09-12.

Use the WPT repository for test mapping and HTML-AAM for accessibility criteria.

Coverage / Open Issues

• CheckedTyped data field, type-state selection, void-element structure, main categories, label relationship, and HTMLInputElement overview
• OpenComplete state-by-state applicability tables, value sanitization, conversion rules, and event processing
• OpenEntry-list generation for form submission, successful controls, and ordering across form-associated elements
• OpenARIA and platform accessibility mapping, browser observations, WPT, and historical changes

This is initial coverage. It describes the checked scope and does not claim that the complete input topic has been verified or is publishable.

Related surface

For displaying a calculation result and describing its relationship to inputs, see the output element.

For a beginner-friendly explanation of choosing a type, using labels, and building a form example, see the input element page in Yugien. For labelable association and accessible names, see the label element in Atlas; for hyperlink conditions and activation behavior, see the a element in Atlas.