Wählen Sie bestimmte Elemente zwischen zwei Elementen aus [jQuery]

Question

Ich würde gerne wissen, ob es möglich ist, bestimmte Elemente zwischen zwei Punkten durch das DOM zu kriechen.

Im Folgenden ein Beispiel des Baumes ist, mein Wunsch ist es, alle die labels mit einem data-tagname Attribute auszuwählen, ausgehend von den input und endete am .parent. Die Idee ist dann, es als Name der Eingabe festzulegen, d. H. Name = "diary_hours_monday_start".

ich dies in einer bestimmten Art und Weise zu tun, zum Beispiel:

$('input').each(function(){ 
    $(this).attr('name', $(this).parent().parent().prev('[data-tagname]').attr('data-tagname') 
+ '_' + $(this).prev('[data-tagname]').attr('data-tagname'); //etc... 
}); 

Aber offensichtlich diese Lösung ist schrecklich, und die Struktur wird nicht immer gleich sind (einige Elemente verschachtelt 5 mal, andere 2).

TL; DR

ich entlang der Linien durchqueren, um den DOM-Baum von Punkt A, Filtern die guten Sachen aus, und Anhalten bei Punkt B nach einer Lösung gesucht Vielleicht gehen wir von A zu B und schiebe alle ausgewählten Elemente in ein leeres Array?

Answer 1

können Sie die .parentsUntil() Funktion die DOM von jedem INPUT zur ersten LI.parent zu durchqueren bis:

$('input').each(function() { 
    var $this = $(this); 
    var name = $this 
     .parentsUntil($this.closest('li.parent').parent(), 'li') 
     .map(
      function() { 
       return $(this).find('> label:first').attr('data-tagname'); 
      } 
     ) 
     .toArray() 
     .reverse() 
     .join('_') 
    ; 

    $this.attr('name', name); 
}); 

Da Sie die erste LI.parent aufnehmen möchten wir seine Eltern als erstes Argument zu .parentsUntil() verwenden.

Dann verwenden wir .map() alle data-tagname Attribute zu aggregieren, um sie zu einem Array typisieren, die umzukehren, und kommen sie in einen String _ als Trennzeichen verwendet wird.

Schließlich setzen wir den Namen jedes INPUT zu diesem Namen String. In Ihrem Beispiel ist das "diary_hours_monday_start".