Function apply

Select the elements matching the keys in applyMap and run the functions given by the values over them. This eliminates the many calls to querySelectorAll, which is quite verbose.

If a key is a number instead of a string, the child element at the index is selected instead. Negative indices can also be used to count from the end backwards.

If a value in applyMap is an object but not an array, apply is called recursively on all selected elements for it with the object used as the applyMap.

Without the third argument (atomic), all selected elements are passed to the functions at once. With the argument given as a truthy value, the elements are passed one by one, so that the behavior is almost like that of web components.

A 4th argument (selectFirst) may also be specified to limit each selection to only the first matching elements. In this case (and in all cases where there is only 1 match), the value of atomic will be irrelevant.

Example

import { apply } from 'deleight/appliance';
apply({
    main: main => {
        const newContent = [...range(101, 120)].map(i => `My index is  now ${i}`);
        const lastChildren = Array.from(main.children).map(c => c.lastElementChild);
        set(lastChildren,  {textContent: newContent});
    }
});
Copy