Maison > interface Web > js tutoriel > La différence entre remove() et detach() dans jquery

La différence entre remove() et detach() dans jquery

巴扎黑
Libérer: 2017-06-25 09:53:53
original
1496 Les gens l'ont consulté

 jquery est un outil très puissant qui est souvent utilisé dans le travail, mais certaines méthodes sont encore ignorées par nous car elles ne sont pas couramment utilisées ou n'ont pas été remarquées.

Remove() et detach() peuvent en faire partie. Peut-être que nous utilisons davantage remove(), mais detach() peut l'être moins. Peut-être que je ne l'ai pas utilisé assez soigneusement. Je ne l'ai pas utilisé une seule fois. Mais cette fois, je l'ai utilisé à cause d'un problème dans un projet. Je l'ai trouvé très intéressant, alors je l'ai enregistré et je l'ai partagé avec tout le monde.

remove() : L'explication officielle est que

supprime tous les éléments correspondants du DOM. Cette méthode ne supprime pas les éléments correspondants de l'objet jQuery, les éléments correspondants peuvent donc être réutilisés ultérieurement. Mais en plus de l'élément lui-même conservé, d'autres éléments tels que les événements liés, les données supplémentaires, etc. seront supprimés.

Je crois comprendre que l'élément est supprimé. Mais comment le retrouver Pour être honnête, je n’ai jamais trouvé d’ami qui l’ait utilisé. Pouvez-vous me dire, merci beaucoup,

Utilisation :

Supprimer tous les paragraphes du DOM

Code HTML :
  <p>Hello</p> how are <p>you?</p>
Copier après la connexion
Code jQuery :
  $("p").remove();
Copier après la connexion
Résultat :
  how are
Copier après la connexion
Copier après la connexion
Pas grand chose à dire sur cette méthode Parlons principalement de la méthode detach(),

Description officielle :

Supprimez tous les éléments correspondants du DOM. Cette méthode ne supprime pas les éléments correspondants de l'objet jQuery, les éléments correspondants peuvent donc être réutilisés ultérieurement. Contrairement à Remove(), tous les événements liés, les données jointes, etc. seront conservés.

Description :

Supprimer tous les paragraphes du DOM

Code HTML :
 <p>Hello</p> how are <p>you?</p>
Copier après la connexion
Code jQuery :
  $("p").detach();
Copier après la connexion
Résultat :
  how are
Copier après la connexion
Copier après la connexion
Description :

Supprimer le paragraphe avec bonjour classe du DOM

Code HTML :
  <p class="hello">Hello</p> how are <p>you?</p>
Copier après la connexion
Code jQuery :
  $("p").detach(".hello");
Copier après la connexion
Résultat :
  how are <p>you?</p>
Copier après la connexion
Quand on regarde les choses de cette façon, il ne semble y avoir aucune différence. Ces deux fonctions, haha. . . . Laissez-moi vous raconter maintenant ce qui m'est arrivé. Alors tout le monde comprendra comment le résoudre.

J'ai un formulaire ici, dont l'un est le code d'enregistrement, c'est-à-dire que chaque information aura un code d'enregistrement indépendant, sans le code d'enregistrement, l'enregistrement ne peut pas réussir. J'utilise le

controlformValidator de jquery pour la vérification. Tout le monde a utilisé ce contrôle. Il démarre la vérification lorsque la page est chargée, et pour les CSS, le affichage et le cache. () dans jquery sont ignorés. Initialement. Ce n'est pas un problème, mais l'utilisateur a présenté une nouvelle demande, qui consiste à ajouter une option pour déterminer s'il faut afficher le code d'enregistrement. S'il n'est pas affiché, ne vérifiez pas la zone de texte du code d'enregistrement. demande.

Après avoir essayé css display et jquery hide(), j'ai jeté mon dévolu sur Remove(). La vérification a été arrêtée, mais lorsque j'ai choisi de vérifier, le contenu supprimé n'a pas pu être rajouté, j'ai donc commencé à chercher quelque chose qui pourrait être rajouté. A ce moment-là, j'ai découvert

detach()。它的有什么好处呢。我下面放一代码出来

var p;
        function selectChange() {
            

            if (document.getElementById("ddl_schoolarea").value != "请选择") {

                p = $("#trlession").detach();
            }
            else {
                //table1为一个table名字
                $("#table1").append(p);
                
            }
        }
Copier après la connexion

Après avoir vu ce code, je ne pense pas avoir besoin de trop expliquer. Tout le monde comprendra, c’est une méthode très intéressante.


Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal