Alla ricerca del metodo find (..) di jQuery che include il nodo corrente

Il metodo traversal di jQuery find (..) non include il nodo corrente, ma inizia con i figli del nodo corrente. Qual è il modo migliore per chiamare un'operazione di ricerca che include il nodo corrente nel suo algoritmo di corrispondenza? Guardando attraverso i documenti nulla mi salta immediatamente fuori.

Per jQuery 1.8 e versioni successive, è possibile utilizzare .addBack(). Richiede un selettore, quindi non è necessario filtrare il risultato:

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

Prima di jQuery 1.8 eri bloccato .andSelf(), (ora deprecato e rimosso) che quindi aveva bisogno di filtraggio:

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

Non puoi farlo direttamente, il più vicino a cui riesco a pensare è usare .andSelf()e chiamare .filter(), in questo modo:

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

Sfortunatamente .andSelf()non accetta un selettore, il che sarebbe utile.

Definire

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

quindi utilizzare

$.findSelf(selector);

invece di

$find(selector);

Purtroppo jQuery non ha questo built-in. Davvero strano per così tanti anni di sviluppo. I miei gestori AJAX non sono stati applicati ad alcuni elementi principali a causa del funzionamento di .find ().

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

È possibile memorizzare $('selector')in una variabile per l'accelerazione. Puoi anche scrivere una funzione personalizzata per questo se ne hai bisogno molto:

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

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

La risposta accettata è molto inefficiente e filtra l'insieme di elementi che sono già abbinati.

//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);

Se vuoi che il concatenamento funzioni correttamente, usa lo snippet di seguito.

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

Dopo la chiamata della funzione end restituisce l'elemento #foo.

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

Senza definire plugin extra, sei bloccato con questo.

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

Se stai cercando esattamente un elemento , sia l'elemento corrente o uno al suo interno, puoi usare:

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

Se stai cercando più elementi puoi usare:

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

L'uso di andSelf/ andBackè piuttosto raro, non so perché. Forse a causa dei problemi di performance che alcuni ragazzi hanno menzionato prima di me.

(Ho notato che Tgr ha già dato quella seconda soluzione)

So che questa è una vecchia domanda, ma c'è un modo più corretto. Se l'ordine è importante, ad esempio quando si abbina un selettore come :first, ho scritto una piccola funzione che restituirà lo stesso esatto risultato come se find()effettivamente includesse il set corrente di elementi:

$.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);
};

Non sarà efficace in alcun modo, ma è il migliore che ho ideato per mantenere un ordine corretto.

Penso che andSelfsia quello che vuoi:

obj.find(selector).andSelf()

Si noti che ciò aggiungerà sempre il nodo corrente, indipendentemente dal fatto che corrisponda o meno al selettore.

Se stai osservando rigorosamente i nodi attuali, lo fai semplicemente

$(html).filter('selector')

Stavo cercando di trovare una soluzione che non si ripetesse (cioè non inserendo lo stesso selettore due volte).

E questa piccola estensione jQuery lo fa:

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

Combina find()(solo discendenti) con filter()(solo l'insieme attuale) e supporta qualsiasi argomento sia mangiato da entrambi. Ciò pushStack()consente .end()di funzionare come previsto.

Usa così:

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

Ecco la verità giusta (ma triste):

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

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