Recorrido jQuery - método not()

Manual de referencias de jQuery

Ejemplo

Elimina el párrafo con id "selected" de la colección que contiene todos los párrafos:

$("p").not("#selected")

Inténtalo tú mismo

Definición y uso

not() Elimina elementos de la colección de elementos coincidentes.

Gramática 1

.not(selector)
Parámetros Descripción
selector Valor de cadena que contiene la expresión de selector utilizada para coincidir con los elementos.

Gramática 2

.not(element)
Parámetros Descripción
element Un o varios elementos DOM que se deben eliminar del conjunto de coincidencias.

Gramática 3

.not(function(index))
Parámetros Descripción
function(index) Función utilizada para detectar cada elemento de la colección. this es el elemento DOM actual.

Descripción detallada

Si se proporciona un objeto jQuery que representa una colección de elementos DOM, el método .not() construirá un nuevo objeto jQuery a partir de un subconjunto de elementos coincidentes. El selector aplicado detectará cada elemento; los elementos que no coinciden con el selector se incluirán en el resultado.

Pensando en la siguiente página con una lista simple:

<ul>
  <li>elemento de lista 1</li>
  <li>elemento de lista 2</li>
  <li>elemento de lista 3</li>
  <li>elemento de lista 4</li>
  <li>elemento de lista 5</li>
</ul>

Podemos aplicar este método al conjunto de elementos de lista:

$('li').not(':even').css('background-color', 'red');

Inténtalo tú mismo

El resultado de esta llamada es establecer el fondo de color rojo para los elementos 2 y 4, ya que no coinciden con el selector (recuerda, :even y :odd utilizan índices basados en 0).

Eliminar elementos específicos

La segunda versión del método .not() permite eliminar elementos del conjunto de coincidencias, asumiendo que ya hemos encontrado estos elementos mediante otros medios. Por ejemplo, imaginemos que una lista ya ha aplicado un id a uno de sus elementos:

<ul>
  <li>elemento de lista 1</li>
  <li>elemento de lista 2</li>
  <li id="notli">elemento de lista 3</li>
  <li>elemento de lista 4</li>
  <li>elemento de lista 5</li>
</ul>

Podemos usar la función nativa de JavaScript getElementById() para leer el tercer elemento de la lista y luego eliminarlo del objeto jQuery:

$('li').not(document.getElementById('notli')).css('background-color', 'red');

Inténtalo tú mismo

Esta sentencia cambia el color de fondo de los elementos 1, 2, 3 y 5. Podemos lograr lo mismo con una expresión jQuery más simple, pero esta técnica es muy útil cuando, por ejemplo, otras bibliotecas proporcionan referencias a nodos DOM puros.

Para jQuery 1.4, el método .not() puede tomar una función como parámetro, al igual que el método .filter(). Los elementos para los que la función devuelve true serán excluidos del conjunto de filtrado; todos los demás elementos se incluirán.

Manual de referencias de jQuery