Question

我正在使用MediumEditor，它是一个使用contenteditables的WYSIWYG编辑器。我需要为contentEditable中的每个元素分配不同的ID，但是（当你按Enter时）编辑器将从具有所有属性的esiting中删除一个段落。我想知道是否有办法从克隆的元素中识别新的<p>元素？新元素可以放在现有元素之前或之后。

更新

这是一个例子： https://jsfiddle.net/wwoh7e62/

<div id="container">
    <p id="myid" class="myclass" data-id="myid">some text</p>
</div>

<button onclick="doClone(); myFunc();">clone</button>

<script>
doClone = function() {
    var container = document.getElementById('container');

    var node = container.getElementsByTagName('p')[0].cloneNode(false);

    node.innerHTML = 'cloned node';

    container.appendChild(node);
}

myFunc = function () {
    console.log('my func');
}
</script>

doClone中的代码我无权访问。我的代码应该驻留在myFunc函数中。

当我输入小提琴时，我意识到解决方案可能是附加一个事件监听器（未被克隆），新节点将是没有事件监听器的节点。

更新

以前分配的ID需要保持不变，因为它们用于识别特定节点。

Answer 1

你可以试试这个：

从“p”
中删除ID
<div id="container"> <p class="myclass" data-id="myid">some text</p> </div> <button onclick="doClone(); myFunc();">clone</button>
然后将它们更新为您的Func函数：

var length = document.getElementById("container").getElementsByTagName("p").length; for(var i=0; i < length; i++) { document.getElementById("container").getElementsByTagName("p")[i].id = i; }

这有帮助吗？

识别克隆的DOM元素

1 个答案: