Diferenças entre detach (), hide () e remove () - jQuery
Qual é a diferença funcional entre esses três jQuerymétodos:
separar ()
Para obter um exemplo de detach, dê uma olhada em stackoverflow.com/questions/12058896/…
hide()define a displaypropriedade CSS dos elementos correspondentes como none.
remove() remove os elementos correspondentes do DOM completamente.
detach()é semelhante remove(), mas mantém os dados armazenados e eventos associados aos elementos correspondentes.
Para inserir novamente um elemento separado no DOM, basta inserir o jQueryconjunto retornado de detach():
Combinado com .clone (true), você pode usar detach para modelos baratos que evitam eventos ao vivo do jquery: jsfiddle.net/b9chris/PNd2t
Ainda não vejo diferença. Se eu usar removeno lugar de detach, o exemplo ainda funcionará.
@comecme: Se você vinculou um evento como um manipulador de clique ao intervalo, chame remove()e anexe-o novamente, o vínculo será removido e clicar no intervalo não fará nada. Se você chamar detach()e reconectar, a ligação permanece e o manipulador de clique continua funcionando.
A resposta de @ Kumar é um pouco mais correta em relação a remove (), já que não é removido do DOM. Isso tem repercussões, pois elementos complexos com eventos associados tendem a consumir muita memória do navegador se não forem mastigados pelo coletor de lixo rápido o suficiente. Um truque para liberar memória mais rápido é $ (element) .html (''). Remove ();
— oskarth
hide () define a propriedade de exibição CSS dos elementos correspondentes como nenhum. Significa: Você pode me descrever a diferença entre hide () e display: none.
Imagine um pedaço de papel sobre uma mesa com algumas notas escritas a lápis.
hide -> jogue uma roupa nele
empty -> remova as notas com uma borracha
detach -> pegue o papel em sua mão e mantenha-o lá para quaisquer planos futuros
remove -> pegue o papel e jogue-o na lixeira
O papel representa o elemento e as notas representam o conteúdo (nós filhos) do elemento.
Um pouco simplificado e não totalmente preciso, mas fácil de entender.
hide() define a exibição do elemento correspondente como nenhum.
detach() remove os elementos correspondentes, incluindo todos os nós de texto e filhos.
Este método armazena todos os dados associados ao elemento e, portanto, pode ser usado para restaurar os dados do elemento, bem como manipuladores de eventos.
remove() também remove os elementos correspondentes, incluindo todos os nós de texto e filhos.
No entanto, neste caso, apenas os dados do elemento podem ser restaurados, não seus manipuladores de eventos.
Em jQuery, existem três métodos para remover elementos do DOM. Estes três métodos são .empty(), .remove()e .detach(). Todos esses métodos são usados ​​para remover elementos do DOM, mas todos são diferentes.
.ocultar()
Oculte os elementos correspondentes. Sem parâmetros, o método .hide () é a maneira mais simples de ocultar um elemento HTML:
.vazio()
O método .empty () remove todos os nós filhos e conteúdo dos elementos selecionados. Este método não remove o próprio elemento ou seus atributos.
O método .empty () não aceita nenhum argumento para evitar vazamentos de memória. jQuery remove outras construções, como manipuladores de dados e eventos, dos elementos filhos antes de remover os próprios elementos.
<div class="hai">Hai</div>
<div class="goodevening">good evening</div>
Isso resultará em uma estrutura DOM com o texto Hai excluído:
<div class="hai"></div>
Se tivéssemos qualquer número de elementos aninhados dentro <div class="hai">, eles também seriam removidos.
.remover()
O método .remove () remove os elementos selecionados, incluindo todo o texto e nós filhos. Este método também remove os dados e eventos dos elementos selecionados.
Use .remove () quando quiser remover o próprio elemento, bem como tudo dentro dele. Além disso, todos os eventos vinculados e dados jQuery associados aos elementos são removidos.
Isso resultará em uma estrutura DOM com o <div>elemento excluído:
Se tivéssemos qualquer número de elementos aninhados dentro <div class="hai">, eles também seriam removidos. Outras construções jQuery, como manipuladores de dados ou eventos, também são apagadas.
O método .detach () remove os elementos selecionados, incluindo todo o texto e nós filhos. No entanto, ele mantém dados e eventos. Este método também mantém uma cópia dos elementos removidos, o que permite que eles sejam reinseridos posteriormente.
O método .detach () é útil quando os elementos removidos devem ser reinseridos no DOM posteriormente.
<p>Hai!</p>Good <p>Afternoo</p>
Para obter mais informações, visite: http://www.scriptcafe.in/2014/03/what-is-difference-between-jquery_15.html