Module 14 · The DOM and Events: JavaScript Touches the Page
When to Use Which: Delegation, innerHTML, Data Attributes and Classes
Free with an accountReading
Rahim's shop page started small: ten products, ten "Add" buttons, ten listeners. A year later it shows five hundred products, loads more as you scroll, and filters as you type. New products appear without listeners. The basket total sometimes disagrees with the page. And a product named <Rahim's> Special once broke the layout.
Checking what this lesson needs for you…
What is inside When to Use Which: Delegation, innerHTML, Data Attributes and Classes
- Delegation or a listener per element
- textContent, innerHTML or building nodes
- A data attribute or a global variable
- A class or an inline style
- Keep a reference, or search again
- Which event: click, input, change or submit
- The comparison table