Определить клонированный элемент DOM

Question

Я использую MediumEditor, который WYSIWYG редактор использует contenteditables. Мне нужно назначить разные идентификаторы для каждого элемента внутри contentEditable, но (когда вы нажимаете Enter) редактор будет клонировать абзац из исходного со всеми его атрибутами. Мне интересно, есть ли способ определить новый <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 функция.

Пока я печатал скрипку, я понял, что решение, вероятно, будет заключаться в подключении прослушивателя событий (который не клонирован), и новый узел будет иметь тот, у которого нет прослушивателя событий.

ОБНОВИТЬ:

идентификаторы, которые были назначены ранее, должны оставаться такими же, как и те, которые используются для идентификации конкретных узлов.

Answer 1

Вы можете попробовать это:

1. Удалить идентификатор из "p"

   <div id="container"> <p class="myclass" data-id="myid">some text</p> </div> <button onclick="doClone(); myFunc();">clone</button>

2. Затем обновите их в своей функции Func:

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

Это помогает?