Correspondance entre deux éléments HTML avec jQuery

J'ai les éléments vides <span> qui peuvent être n'importe où dans le DOM. Ils ont une classe spécifique et id comme <span class="start" id="V.64"/> et <span class="end" id="V.64.end"/>. Donc, je peux identifier le point de départ et le point de terminaison via le id. Je veux maintenant mettre en évidence tout ce qui se trouve entre ces deux éléments <span>. Y a-t-il un moyen de le faire avec jQuery?Correspondance entre deux éléments HTML avec jQuery

Exemple HTML:

<html> 
<head> 
    <title></title> 
</head> 
<body> 
    <p class="upper-case"> 
     <b>In Matutinis</b> 
     <span class="ab"> 
      <b data-toggle="tooltip">INV</b> 
      <i class="incipit">Rex noster</i>. <span class="phenomena">*</span> 
     </span> 
     <span class="ab"> 
      <span class="start" id="V.112"/> 
     </span> 
     <span class="ab">In Secundo Nocturno <b data-toggle="tooltip" data-original-title="" 
       title="">AN</b> 
      <i class="incipit">Nox praecessit</i>. <span class="end" id="V.112.end"/><b 
       data-toggle="tooltip" data-original-title="" title="">RP</b> 
      <i class="incipit">Civitas Hierusalem</i>. 
       <i class="incipit" 
       >Sicut mater</i>. <b data-toggle="tooltip" data-original-title="" title="" 
       >RV</b> 
      <i class="incipit">Deus a Libano veniet</i>. <span class="start" id="V.114"/> 
     </span> 
     <span class="ab">In Tertio Nocturno 
       <span class="end" id="V.114.end"/> 
      <b data-toggle="tooltip">EV</b> 
      <i class="incipit">Erunt signa in sole</i>. <b data-toggle="tooltip">RP</b> 
     </span> 
    </p> 
</body>

Notez que les portées de début et de fin peuvent être partout dans le DOM. Pas seulement des frères et soeurs! Merci beaucoup pour vos réponses!

Source

2017-08-11 mr. parchman

Nous devons ** enrouler ** le contenu entre '' et ' 'dans un autre' 'et leur donner un arrière-plan. Est-ce que vous avez besoin? – weBBer

Votre code HTML n'est pas conforme au W3C, vous ne voulez pas avoir une ouverture '' comme vous pouvez le faire avec les entrées. Overthink votre structure DOM, peut-être ajouter des classes aux éléments que vous attendez à être mis en évidence à la fois. –

Vous ne pouvez pas envelopper tout ce qui se trouve sur différents niveaux hiérarchiques dans le DOM. Et je veux ajouter des classes aux éléments qui doivent être mis en évidence mais je dois trouver quels sont ces éléments, c'est la question centrale. Je ne peux pas changer la structure DOM cependant. –

Oui, cela est possible en utilisant .nextUntil()

e. g.

var everythingInBetween = $('#V\\.64.start').nextUntil('#V\\.64.end').andSelf();

Notez que vous devrez échapper le "." dans le id-sélecteur.

Source

2017-08-11 13:29:35

Correspondance entre deux éléments HTML avec jQuery

Répondre

Questions connexes