Блог

Главная - Вопросы по программированию - Как элемент доступен после метода .remove()?

Как элемент доступен после метода .remove()?

#jquery

#jquery ( jquery )

Вопрос:

когда мы используем $("selector").remove() для любого элемента, он будет немедленно удален и $("selector").remove() является синхронным методом, поэтому следующий оператор будет выполнен при удалении элемента. Но в моем случае элемент все еще доступен после его удаления.

 $("#click1").on("click", function() {
  $(this).remove();
  alert($(this).text());
}); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="click1">
  click on me
</button>

Мой вопрос в том, если элемент удален (из dom) Как я все еще могу получить к нему доступ $(this).text() ?
есть какие-нибудь идеи?

Обновить:

В любом другом случае этого не происходит

 $("#click1").on("click", function() {
  $(this).remove();
  alert($(this).text());
});
$("#click2").on("click", function() {
  $("#click1").remove();
  alert($("#click1").text());

}) 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="click1">
  click on me
</button>
<button id="click2">
  click on me too
</button>

Теперь вторая кнопка, немедленно удалите элемент, и меня больше нет, получите доступ к элементу (даже спустя очень мало времени)

Комментарии:

1. remove() метод просто извлекает элемент из DOM

2. Это ожидаемое поведение. $.fn.remove() удаляет элемент из DOM, а не любую ссылку на него

3. Разве это не здорово, что объекты не исчезают из существования, потому что вы удалили их со страницы?

4. Следующее редактирование связано с тем, что $("#click1") выполняется поиск в DOM, и там элемент больше не существует, поэтому он возвращает пустой набор jq.

Ответ №1:

jQuery использует removeChild внутренне, и в документации указано

Удаленный дочерний узел все еще существует в памяти, но больше не является частью DOM.

…вы можете повторно использовать удаленный узел позже в своем коде,

… предполагая, что ваш код не сохранил никаких других ссылок на узел в другом месте, он немедленно станет непригодным для использования и безвозвратным и обычно автоматически удаляется из памяти через короткое время.

В вашем обработчике событий this все еще ссылается на узел, поэтому он не удаляется из памяти и может использоваться до тех пор, пока у вас есть ссылка на узел

Когда вы снова выполняете $("#click1") jQuery uses .getElementById для извлечения элемента из DOM, но его больше нет в DOM, он был удален.

Ответ №2:

В общем, объекты существуют до тех пор, пока на них существует ссылка.

В вашем первом примере:

 $(this).remove();
alert($(this).text());

… у вас все еще есть ссылка на объект после его удаления (в this ), поэтому объект все еще существует, и вы можете получить его текст (его дочерние узлы все еще существуют, потому что у него есть ссылки на них).

В вашем втором примере:

 $("#click1").remove();
alert($("#click1").text());

…. после удаления элемента из документа вы пытаетесь найти его, просмотрев его в документе. Его больше нет в документе, поэтому неудивительно, что вы его не нашли.

Метки: