Skip to content

Test arrive.js for existing element

Serguei Shimansky edited this page May 11, 2017 · 1 revision

Live Demo

HTML:

<div class="test-elem" style="width:5rem;height:5rem;">
<h1>
Existing Element
</h1>
</div>

JS:

var options = {
    fireOnAttributesModification: true, // Defaults to false. Setting it to true would make arrive event fire on existing elements which start to satisfy selector after some modification in DOM attributes (an arrive event won't fire twice for a single element even if the option is true). If false, it'd only fire for newly created elements.
    onceOnly: true,                      // Defaults to false. Setting it to true would ensure that registered callbacks fire only once. No need to unbind the event if the attribute is set to true, it'll automatically unbind after firing once.
    existing: true                      // Defaults to false. Setting it to true would ensure that the registered callback is fired for the elements that already exist in the DOM and match the selector. If options.onceOnly is set, the callback is only called once with the first element matching the selector.
};
document.arrive(".test-elem", options, function() {
    this.style.color="red";
});
Clone this wiki locally