Suchen Sie nach der jQuery find (..) -Methode, die den aktuellen Knoten enthält

Die Traversal-Methode jQuery find (..) enthält nicht den aktuellen Knoten - sie beginnt mit den untergeordneten Knoten des aktuellen Knotens. Was ist der beste Weg, um eine Suchoperation aufzurufen, die den aktuellen Knoten in ihren Übereinstimmungsalgorithmus einbezieht? Beim Durchsehen der Dokumente springt mir nichts sofort heraus.

Für jQuery 1.8 und höher können Sie verwenden .addBack(). Es ist ein Selektor erforderlich, damit Sie das Ergebnis nicht filtern müssen:

object.find('selector').addBack('selector')

Vor jQuery 1.8 waren Sie festgefahren .andSelf()(jetzt veraltet und entfernt), was dann gefiltert werden musste:

object.find('selector').andSelf().filter('selector')

Sie können dies nicht direkt tun. Ich kann mir nur .andSelf()vorstellen .filter(), Folgendes zu verwenden und anzurufen :

$(selector).find(oSelector).andSelf().filter(oSelector)
//or...
$(selector).find('*').andSelf().filter(oSelector);

Nimmt leider .andSelf()keinen Selektor mit, was praktisch wäre.

Definieren

$.fn.findSelf = function(selector) {
    var result = this.find(selector);
    this.each(function() {
        if ($(this).is(selector)) {
            result.add($(this));
        }
    });
    return result;
};

dann benutze

$.findSelf(selector);

anstatt

$find(selector);

Leider verfügt jQuery nicht über diese integrierte Funktion. Wirklich seltsam für so viele Jahre der Entwicklung. Meine AJAX-Handler wurden aufgrund der Funktionsweise von .find () nicht auf einige Top-Elemente angewendet.

$('selector').find('otherSelector').add($('selector').filter('otherSelector'))

Sie können $('selector')zur Beschleunigung in einer Variablen speichern. Sie können sogar eine benutzerdefinierte Funktion dafür schreiben, wenn Sie sie häufig benötigen:

$.fn.andFind = function(expr) {
  return this.find(expr).add(this.filter(expr));
};

$('selector').andFind('otherSelector')

Die akzeptierte Antwort ist sehr ineffizient und filtert den Satz von Elementen, die bereits übereinstimmen.

//find descendants that match the selector
var $selection = $context.find(selector);
//filter the parent/context based on the selector and add it
$selection = $selection.add($context.filter(selector);

Wenn Sie möchten, dass die Verkettung ordnungsgemäß funktioniert, verwenden Sie das folgende Snippet.

$.fn.findBack = function(expr) {
    var r = this.find(expr);
    if (this.is(expr)) r = r.add(this);
    return this.pushStack(r);
};

Nach dem Aufruf der Endfunktion wird das Element #foo zurückgegeben.

$('#foo')
    .findBack('.red')
        .css('color', 'red')
    .end()
    .removeAttr('id');

Ohne zusätzliche Plugins zu definieren, bleiben Sie dabei.

$('#foo')
    .find('.red')
        .addBack('.red')
            .css('color', 'red')
        .end()
    .end()
    .removeAttr('id');

Wenn Sie genau ein Element suchen , entweder das aktuelle Element oder eines darin, können Sie Folgendes verwenden:

result = elem.is(selector) ? elem : elem.find(selector);

Wenn Sie nach mehreren Elementen suchen , können Sie Folgendes verwenden:

result = elem.filter(selector).add(elem.find(selector));

Die Verwendung von andSelf/andBack ist ziemlich selten, nicht sicher warum. Vielleicht wegen der Leistungsprobleme, die einige Leute vor mir erwähnt haben.

(Mir ist jetzt aufgefallen, dass Tgr diese zweite Lösung bereits gegeben hat)

Ich weiß, dass dies eine alte Frage ist, aber es gibt einen korrekteren Weg. Wenn die Reihenfolge wichtig ist, zum Beispiel wenn Sie mit einem Selektor wie übereinstimmen :first, habe ich eine kleine Funktion geschrieben, die genau das gleiche Ergebnis zurückgibt, als ob sie find()tatsächlich den aktuellen Satz von Elementen enthält:

$.fn.findAll = function(selector) {
  var $result = $();

  for(var i = 0; i < this.length; i++) {
    $result = $result.add(this.eq(i).filter(selector));
    $result = $result.add(this.eq(i).find(selector));
  }

  return $result.filter(selector);
};

Es wird keineswegs effizient sein, aber es ist das Beste, was ich mir ausgedacht habe, um die richtige Ordnung aufrechtzuerhalten.

Ich denke andSelfist was du willst:

obj.find(selector).andSelf()

Beachten Sie, dass dadurch immer der aktuelle Knoten hinzugefügt wird, unabhängig davon, ob er mit dem Selektor übereinstimmt oder nicht.

Wenn Sie streng nach den aktuellen Knoten suchen, tun Sie dies einfach

$(html).filter('selector')

Ich habe versucht, eine Lösung zu finden , die sich nicht wiederholt (dh nicht zweimal denselben Selektor eingibt).

Und diese winzige jQuery-Erweiterung macht es:

jQuery.fn.findWithSelf = function(...args) {
  return this.pushStack(this.find(...args).add(this.filter(...args)));
};

Es kombiniert find()(nur Nachkommen) mit filter()(nur aktuelle Menge) und unterstützt alle Argumente, die beide essen. Das pushStack()erlaubt.end() , wie erwartet zu arbeiten.

Verwenden Sie wie folgt:

$(element).findWithSelf('.target')

Hier ist die richtige (aber traurige) Wahrheit:

$(selector).parent().find(oSelector).filter($(selector).find('*'))

http://jsfiddle.net/SergeJcqmn/MeQb8/2/