22 lines
1.2 KiB
Markdown
22 lines
1.2 KiB
Markdown
|
# now and later
|
||
|
|
|
||
|
|
You know the situation: you create some HTML nodes dynamically. But the new elements behave not the way, you expected, because you enriched the functionality with javascript.
|
||
|
|
|
||
|
|
These newly created elements did not exist, when your initializers ran, so they got not initialized.
|
||
|
|
|
||
|
|
But often it is hard to have your initialize functions available - or maybe they realy do not belong to the functionality, which created them.
|
||
|
|
|
||
|
|
To help with exactly this situation, there is nowAndLater.
|
||
|
|
|
||
|
|
So instead of spreading your initializer calls everywhere, you use `nowAndLater` from the beginning. And all elements which arive later to the party, will handled exactly like those nerds, which were there from the very beginning.
|
||
|
|
|
||
|
|
Usage is as follows:
|
||
|
|
|
||
|
|
```javascript
|
||
|
|
nowAndLater('a.submit-form', (a) => {
|
||
|
|
a.addEventListener('click', () => a.closest('form').submit())
|
||
|
|
})
|
||
|
|
```
|
||
|
|
|
||
|
|
The function takes exactly two arguments: a selector, which will used to identify the elements to work with and a callback, which will be called for each element, that matches this selector. This will happen in the moment you call the nowAndLater function - and everytime a new DOM element arrives, which matches your selector.
|