← Tutorials

DOM References

The server can define an element of the page as a module: any module requires it by name instead of looking it up.

Controller.php

return (new AsyncResponse())
    ->defineElement('tutorial/Target', 'box-a')
    ->call('tutorial/Highlight', 'pulse')
    ->send();

// JavaScript: the module is the element
export default class Highlight {
    pulse() {
        requireModule('tutorial/Target')
            .classList.add('ring-4');
    }
}

Try it

#box-a

Highlight

#box-b

Highlight

#box-c

Highlight

Elements as modules

The server defines which element the module gets, and the module requires it by name: tutorial/Target.