Question

我在页面中克隆了一个textarea但是克隆的元素没有任何主要元素的事件，有没有办法克隆克隆元素中的所有事件？

var dupNode = node.cloneNode(deep);

Answer 1

您可以在节点上使用getEventListeners吗？不知道支持是怎么回事，或者它是否只在控制台中支持？

function cloneMassive(node) {
    // Clone the node, don't clone the childNodes right now...
    var dupNode = node.cloneNode(false);
    var events = getEventListeners(node);

    for(var p in events) {
        // All events is in an array so iterate that array:
        events[p].forEach(function(ev) {
            // {listener: Function, useCapture: Boolean}
            dupNode.addEventListener(p, ev.listener, ev.useCapture);
        });
    }
    // Also do the same to all childNodes and append them.
    if (node.childNodes.length) {
        [].slice.call(node.childNodes).forEach(function(node) {
            dupNode.appendChild(cloneMassive(node));
        });
    }

    return dupNode;
}

var dupBody = cloneMassive(document.body);

但似乎并不真正支持getEventListeners：

Get event listeners attached to node using addEventListener

如果您需要复制节点上的所有事件属性，则需要列出所有事件属性，然后将其复制到：

['onclick', 'onmouseover', '...'].forEach(function(method) {
    dupNode[method] = node[method];
});

Answer 2

我最近解决了这个问题，即使这是老帖子，以防万一有人试图找出答案，我添加了我的解决方案：

var button = document.createElement("i");
var click = document.createAttribute("onclick");
click.value = "FunctionName(this)";
button.attributes.setNamedItem(click);

不要使用addEventListener，只需创建函数FunctionName即可。如果您正在扩展使用addEventListener

的对象，这将毫无用处

克隆元素及其所有事件

2 个答案: