jQuery: cómo comprobar si dos elementos son iguales.

Question

Necesito pasar un elemento a una función y luego hacer coincidir ese elemento específico al atravesar el elemento primario. La trampa (para alguien desorientado como yo) es que este elemento no tiene una identificación. En el siguiente ejemplo, quiero que cada elemento a su vez de color rosa, sino el hecho clic en que debe ponerse amarillas

function colorize(element) { 
    element.parent().find('span').each(function() { 
     if ($(this)===element) { // the problem is this is always false 
      $(this).css('background','yellow'); 
     } else { 
      $(this).css('background','pink'); 
     } 
    }); 
} 
$('span').click(function() { 
    colorize($(this)); 
}); 

Answer 1

Comparación de objetos JQuery no volverá verdad, porque cada objeto jQuery es aa nuevo objeto, incluso si sus selectores son igual.

Para comparar elementos, hay que comprobar si los elementos DOM son iguales:

this === element.get(0); 

Answer 2

Usted no tiene que hacerlo. Siempre aplica el estilo especial a un elemento específico, así que coloreéelos todos y luego cambie el color del elemento específico.

function colorize(element) { 
    element.parent().find('span').each(function() { 
     $(this).css('background','pink'); 
    }); 

    element.css('background','yellow'); 
} 

El problema con su comparación fue que estaba comparando dos objetos (objetos jQuery). Al comparar objetos, a menos que estén apuntando a lo mismo, se consideran desigual:

var o1 = {}; 
var o2 = {}; 
o1 !== o2; 

Puede solucionar esto mediante la eliminación de la envoltura de jQuery:

function colorize(element) { 
    var realElement = element[0]; 

    element.parent().find('span').each(function() { 
     if (this === realElement) { 
      $(this).css('background','yellow'); 
     } else { 
      $(this).css('background','pink'); 
     } 
    }); 
} 

De esta manera, estás comparar elementos DOM a elementos DOM, y no manzanas a naranjas u objetos a objetos.

Answer 3

Uso isEqualNode

this.isEqualNode(element) 

O utilice isSameNode (en desuso)

this.isSameNode(element) 

Answer 4

Puede utilizar la función de jQuery is(). La respuesta original se puede encontrar here.

function colorize(element) { 
    element.parent().find('span').each(function() { 
     if ($(this).is(element)) { 
      $(this).css('background','yellow'); 
     } else { 
      $(this).css('background','pink'); 
     } 
    }); 
}