Как назначить обработчики из клонируемого єлемента на его клон?

Question

[kavalorn123]

как назначить обработчики из клонируемого єлемента на его клон?

чистый Javascript!

Answer 1

[kavalorn123]

нашел решение в виде document.adoptNode();

Answer 2

[Виталий Архипов]

Перехватом addEventListener

<div id="div1">div1</div>
<script>
    // BEFORE ANY CODE
    const div1 = document.querySelector("#div1");
    const realAddEventListener = div1.addEventListener.bind(div1);
    const realRemoveEventListener = div1.removeEventListener.bind(div1);
    const events = [];
    div1.addEventListener = (name, listener, opts) => {
        events.push({ name, listener, opts });
        return realAddEventListener(name, listener, opts);
    };
    div1.removeEventListener = (name, listener, opts) => {
        events = events.filter((e) => (e.name === name && e.listener === listener));
        realRemoveEventListener(name, listener, opts);
    };

    // CODE
    div1.addEventListener("click", () => alert("click"), false);

    // CLONE

    const div2 = div1.cloneNode();
    div2.innerHTML = "div2";

    events.map((e) => div2.addEventListener(e.name, e.listener, e.opts));

    document.querySelector("body").appendChild(div2);
</script>