Почему зарегистрированные события исчезают при удалении элемента из DOM?

Question

Этот код jQuery 1.3.2 добавляет элемент на страницу, регистрирует событие «щелчка», затем удаляет и повторно присоединяет элемент:

var button = $('<button>Click me!</button>')
  .click(function(){ alert("Hello") })
  .appendTo('body');

$('body').html('');

button.appendTo('body');

Кнопка появляется на странице, как и ожидалось, но нажатие на нее ничего не делает. Я хотел бы знать, почему обработчики событий были удалены из объекта.

Примечание. Мне известны такие решения, как jQuery.live() или clone(true) или использование appendTo без удаления. Я ищу объяснение , а не решение или обходной путь.

РЕДАКТИРОВАТЬ: я полагаю, это может быть произвольным и нелогичным решением DOM. Объяснение типа «потому что так хочет раздел X спецификации Y», было бы хорошо.

Answer 1

Когда вы удаляете элемент из DOM с помощью jQuery, все данные (включая обработчики событий), хранящиеся в jQuery для этого элемента, будут уничтожены. Это сделано, чтобы избежать утечек памяти.

Это не функция (или ошибка) DOM API. Это просто jQuery.

Answer 2

Если вы хотите, чтобы ваши зарегистрированные события остались на вашем элементе, используйте .detach () вместо .remove (). Используйте его так же, как вы используете .remove (), он будет хранить ваши события в вашем элементе.