Node: Using Node Change Events
This example demonstrates how to listen for and handle Node change events.
Hover over or inspect the items to see the result of the title change.
- lorem
- ispum
- dolor
- sit
Setting up the Node
First we need some HTML to work with.
Handling Change Events
When an attribute of a Node instance changes, it fires a change event. The event object passed to the handler contains special properties related to the change; the prevVal and newVal, represent, respectively, the previous value of the attribute, and the new value to be assigned. Listening on change gives us the opportunity to prevent the change from happening, or to modify the new value prior to being set.
Listening for Change Events
In this case, we will listen for a titleChange on the first list item, and prevent that change from happening. Then we will go ahead and set the title for all items, noting that the first item's change is prevented.
