# Attribute “currency” not allowed on element “span” at this point.

> Canonical HTML version: https://rocketvalidator.com/html-validation/attribute-currency-not-allowed-on-element-span-at-this-point
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

The HTML specification defines a specific set of allowed attributes for each element. The `<span>` element supports global attributes (such as `id`, `class`, `style`, `title`, etc.) but does not recognize `currency` as a valid attribute. When you add a non-standard attribute like `currency` to an element, the W3C validator flags it because it doesn't conform to the HTML standard.

This pattern often appears in e-commerce sites, financial applications, or internationalization contexts where developers want to associate a currency code (like `USD`, `EUR`, or `GBP`) with a price displayed in a `<span>`. While browsers will typically ignore unrecognized attributes without breaking the page, using them creates several problems:

- **Standards compliance**: Invalid HTML can lead to unpredictable behavior across different browsers and future browser versions.
- **Maintainability**: Other developers (or tools) won't recognize non-standard attributes, making the codebase harder to understand and maintain.
- **Accessibility**: Assistive technologies rely on valid, well-structured HTML. Non-standard attributes may be ignored or misinterpreted.
- **JavaScript interoperability**: The `HTMLElement.dataset` API is specifically designed to work with `data-*` attributes, providing a clean and standard way to read custom data from elements.

The fix is straightforward: HTML provides the `data-*` attribute mechanism specifically for embedding custom data on elements. Any attribute prefixed with `data-` is valid on any HTML element, and its value is accessible in JavaScript via the `element.dataset` property.

## Examples

### ❌ Invalid: Non-standard `currency` attribute

```html
<span currency="USD">49.99</span>
```

This triggers the validation error because `currency` is not a recognized attribute for `<span>`.

### ✅ Fixed: Using a `data-currency` attribute

```html
<span data-currency="USD">49.99</span>
```

The `data-currency` attribute is valid HTML. In JavaScript, you can access its value like this:

```js
const span = document.querySelector('span');
console.log(span.dataset.currency); // "USD"
```

### ✅ Alternative: Using `data-*` with richer markup

If you need to convey more structured information, you can combine multiple `data-*` attributes:

```html
<span class="price" data-currency="EUR" data-amount="29.99">€29.99</span>
```

### ✅ Alternative: Using microdata or structured markup

For SEO and machine-readable data, consider using established vocabularies like Schema.org:

```html
<span itemscope itemtype="https://schema.org/MonetaryAmount">
  <meta itemprop="currency" content="USD">
  <span itemprop="value">49.99</span>
</span>
```

This approach provides semantic meaning that search engines and other consumers can understand, while remaining fully valid HTML.