16 lines
1.6 KiB
Plaintext
16 lines
1.6 KiB
Plaintext
== Why is this an issue?
|
|
|
|
Non-interactive DOM elements are HTML elements that are not designed to be interacted with by the user, for instance ``++<div>++``, ``++<span>++``, and ``++<footer>++``, etc. They are typically used to structure content and do not have built-in interactivity or keyboard accessibility.
|
|
|
|
Interactive handlers, on the other hand, are event handlers that respond to user interactions. These include handlers like ``++onClick++``, ``++onKeyDown++``, ``++onMouseUp++``, and more. When these handlers are added to an HTML element, they make the element respond to the specified user interaction.
|
|
|
|
When non-interactive elements have interactive handlers, it can lead to several problems:
|
|
|
|
* Unexpected behavior: Non-interactive elements are not designed to be interactive, so adding interactive handlers can cause unexpected behavior. For example, non-interactive elements do not naturally receive keyboard focus, so keyboard users might not be able to activate the handler.
|
|
|
|
* Confusing for assistive technologies: Assistive technologies might not announce non-interactive elements with interactive handlers correctly. This can make it difficult for users to understand how to interact with the content.
|
|
|
|
* Violation of HTML standards: Using interactive handlers on non-interactive elements can be seen as a misuse of HTML, as it goes against the intended use of these elements.
|
|
|
|
By enforcing that interactive handlers are only used on interactive elements, this rule helps create a more predictable and user-friendly experience for all users, and ensures that web content adheres to accessibility standards and best practices.
|