Data attribute
An HTML data attribute is a custom attribute whose name begins with data- and whose value stores application-specific information on an element.
BDD in Action, Second Edition
An HTML data attribute is a custom data-* attribute for storing additional information on a standard HTML element.
- How it is used
- Supports automated UI tests by providing element locators that are less coupled to page layout and implementation details.
- How deep it goes
- Defines the purpose, compares locator stability, and demonstrates HTML usage, but does not develop data-attribute internals.
- Examples
- Uses a login form with data-testid values for email, password, and login controls.
- What you can do after
- Apply it via WebDriver by adding data-testid markers to HTML controls and using them as test locators.
Read how BDD in Action, Second Edition explains data attribute →
Tiny CSS Projects
A data attribute is a custom HTML attribute whose name begins with data- and whose value stores application-specific information.
- How it is used
- Uses custom attributes to label mobile table cells after responsive CSS transforms rows into card-like layouts.
- How deep it goes
- Shows attribute syntax, CSS selection, attr(), alignment, and accessibility handling, but does not discuss JavaScript data-attribute APIs.
- Examples
- Demonstrates data-name on checkout-table cells and displays labels such as Item: before their contents.
- What you can do after
- Apply it via CSS selectors, pseudo-elements, and attr() to create labeled mobile table cells.
Related concepts
- razor expressionused by · A Razor expression is an inline construct that evaluates an embedded C# expression and inserts its result into generated output.
- HTMLpart of · HTML (HyperText Markup Language) is the standard markup language for structuring content and elements in web documents.
- Document Object Modelused by · The Document Object Model (DOM) is a standard programming interface that represents a document as a structured tree of objects and provides ways to access and modify its content and structure.
- placeholderalternative to · A placeholder is a temporary or symbolic stand-in for a value, content, component, or position that is supplied, replaced, or resolved later.
- attributecontrasts with · An attribute is a named property, value, or piece of information associated with an entity, object, or program element.
These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.