Supprimer des éléments du DOM à partir de l'objet jQuery

jQuery facilite supprimer des nœuds du DOM. Mais comment voulez-vous supprimer des éléments du DOM à partir d'un objet jQuery?

  • Ce genre de chose sont que vous essayez de l'enlever?
  • Rien en particulier. Je veux juste en savoir plus sur le fonctionnement de jQuery ne sa magie. Il y a une bonne documentation sur jQuery site sur cette API, mais aussi (autre que de passer par la source) je n'ai pas vu beaucoup de documentation sur le fonctionnement interne de l'objet jQuery.
InformationsquelleAutor Will Peavy | 2009-09-10
  1. 54

    Si vous parlez à propos de la suppression des nœuds de l'objet jQuery, utilisez le filter ou not fonctions. Voir ici pour plus d'.

    Comment utiliser filter:

    var ps = $('p');

//Removes all elements from the set of matched elements that do 
//not match the specified function.
ps = ps.filter(function() {
  //return true to keep it, false to discard it
  //the logic is up to you.
});

    ou

    var ps = $('p');

//Removes all elements from the set of matched elements that 
//do not match the specified expression(s).
ps = ps.filter('.selector');

    Comment utiliser not:

    var ps = $('p');

//Removes elements matching the specified expression 
//from the set of matched elements.
ps = ps.not('.selector');
    • merci pour la réponse. Savez-vous si le filtre supprime un nœud à partir de l'objet à l'échelle mondiale, ou tout simplement local à sa fonction?
    • Une chose qui a déclenché m'est il ne fait pas enlever quoi que ce soit à partir d'un sélecteur de mise en cache, sauf si vous réaffectez. Si vous avez besoin ps = ps.filter(function() { //choses });
    InformationsquelleAutor geowa4
  2. 8

    Comme déjà mentionné, $.filter() est une excellente option pour filtrer les données. Notez également que l'objet jQuery peut être traitée comme un tableau, et en tant que tel, vous pouvez utiliser les méthodes de tableau comme splice() sur elle.

    var people = $(".people");
people.splice(2,1); //Remove 1 item starting from index 2
    • Lire learningjquery.com/2008/12/peeling-away-the-jquery-wrapper
    • vous l'avez lu? colombie-britannique, il ne veut pas dire que c'est un tableau à tous. vous pouvez en obtenir un, bien sûr, et jQuery peut se comporter comme un tableau à certains égards. mais il n'est pas encore un tableau--une distinction importante. en fait, quelques-uns des fonctions de tableau de travail sur l'objet jQuery, comme indiqué dans mon premier commentaire.
    • Oui, je l'ai lu. Je sais que c'est pas un tableau (techniquement), donc je m'excuse pour mon mauvais libellé. Ce que je voulais communiquer, c'est que vous pouvez le traiter comme un tableau - comme mon exemple souligné.
    • affaire. habituellement, je ne suis pas pointilleux sur les mots, mais c'est une erreur commune que je vois beaucoup de gens le font, qui les conduit à passer beaucoup de temps à se gratter la tête.
    • En jQuery v1.8.3 .pop() et .maj() ne sont pas disponibles pour les objets jQuery.
    • Ce sujet .remove() ?
    • supprime l'élément à partir de la page, la suppression de tout associé HTML, événements, etc (il y a aussi detach() qui prend l'élément de la page, mais le garde en mémoire les événements sont encore attachés). Cette question est au sujet du maintien de l'élément jQuery, mais sortir d'un objet jQuery.

    InformationsquelleAutor Sampson
  3. 2
    <ul>
    <li class="1" />
    <li class="2" />
    <li class="3" />
    <li class="4" />
    <li class="5" />
</ul>

    Filtre passe en revue l'objet jQuery collection. Pour chacun des éléments: Retour true à l'intérieur de filter() de garder l'élément courant dans le jQuery objet de collection. Retour false pour supprimer l'objet actuel de l'objet jQuery collection.

    $("li").filter(function ()
{
    if (this.className == "1" || this.className == "2") return true;

    return false;
});

    Dans ce cas, la fonction anonyme exécuté par filter() retourne true, pour l'élément de liste qui a la classe 1 et/ou 2, à son tour, en supprimant les trois derniers de la liste-les éléments de l'objet jQuery collection.


    Un exemple pratique:

    <ul>
    <li class="1" />
    <li class="2" />
    <li class="3" />
    <li class="4" />
    <li class="5" />
</ul>

    Cet extrait ajoute une classe ("bleu") de la liste non ordonnée. Il met ensuite en lumière les deux premiers de la liste-articles. Attache ensuite un clic-gestionnaire pour les deux premiers de la liste-articles:

    $(function ()
{
    $("ul").addClass("blue").find("li").filter(function ()
    {        
        if (this.className == "1" || this.className == "2") return true;

        return false;

    }).addClass("highlight").click(function ()
    {
        alert("I am highlighted!");
    });
});
    InformationsquelleAutor cllpse