60 votes

Comment sélectionner tout le contenu entre deux balises dans jQuery

J'ai un document avec les titres et les listes non ordonnées.

Comment puis-je utiliser JQuery pour sélectionner un titre (par son unique nom de la classe) ET tout le contenu entre cette position et le prochain titre?

Mise à jour:

Vos suggestions sont grands, mais ils ne sont pas ce que je cherche. Dans le code ci-dessous, par exemple, je voudrais qu'à l'accès de la "h1" avec l'id de "heading2" et tout et tout, mais pas y compris le "h1" avec l'id de "heading3".

Le jQuery exemples fournis ci-dessus auront accès à everyting après le premier "h" de la balise qui n'est pas un "h" tag.

... ou, corrigez-moi si je me trompe :)

    <h1 id="heading1">...</h1>
        <ul>...</ul>
        <p>...</p>
        <ul>...</ul>
        <p>...</p>
    <h1 id="heading2" >...</h1>
        <ul>...</ul>
        <p>...</p>
        <ul>...</ul>
        <p>...</p>
    <h1 id="heading3" >...</h1>
        <ul>...</ul>
        <p>...</p>
        <ul>...</ul>
        <p>...</p>

73voto

Jonathan Sampson Points 121800

Deux méthodes, en particulier, serait très utile à la résolution de ce problème: .nextUntil, et .andSelf. La première vous permet de retrouver tous les frères et sœurs à la suite de votre sélecteur, et la deuxième bosse dans tout ce qui est compensée par le sélecteur ainsi, vous donnant un objet jQuery qui comprend tous les:

$("#heading2")
    .nextUntil("#heading3").andSelf()
        .css("background", "red");

Ce est la suivante:

enter image description here

15voto

Afe Points 151

7voto

Lasse Espeholt Points 11944

Voici la solution que j'utilise pour mes projets:

sélecteur jQuery

 (function ($) {
    $.fn.between = function (elm0, elm1) {
        var index0 = $(this).index(elm0);
        var index1 = $(this).index(elm1);

        if (index0 <= index1)
            return this.slice(index0, index1 + 1);
        else
            return this.slice(index1, index0 + 1);
    }
})(jQuery);
 

Usage

 $('body').between($('#someid'), $('#someid2')).each(function () {
    // Do what you want.
});
 

4voto

jesper Points 39

$ ("# secondSelector"). prevAll ('# firstSelector ~ * ")

2voto

Ricardo Vega Points 1175

Oui vous avez raison. Cela évitera uniquement le sélecteur souhaité. Peut-être que cela doit être plus détaillé:

 $(firstSelector).nextAll().not(secondSelector).not($(secondSelector).nextAll()).text()
 

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X