Selector de jQuery "Todos menos no"

89

Puedo seleccionar (usando jQuery) todos los divs en un marcado HTML de la siguiente manera:

$('div')

Pero quiero excluir un particular div(digamos tener id="myid") de la selección anterior.

¿Cómo puedo hacer esto usando las funciones de Jquery?

javascript jquery jquery-selectors

— siva636
fuente

2

use el selector not en jquery

— abhijit

171

Sencillo:

$('div').not('#myid');

El uso .not()eliminará los elementos que coincidan con el selector que se le dio del conjunto devuelto por $('div').

También puede utilizar el :not()selector:

$('div:not(#myid)');

Ambos selectores hacen lo mismo, sin embargo, :not()es más rápido , presumiblemente porque el motor de selección de jQuery, Sizzle, puede optimizarlo en una .querySelectorAll()llamada nativa .

— Bojangles
fuente

1

@Raynos No creo que sea necesariamente malo , pero usarlo .not()es mucho, mucho mejor que :not().

— Bojangles

1

Creo que debería ser $('div:not(#myid)');(sin comillas). @Raynos: ¿Por qué? :not()es un selector de CSS3. jQuery puede pasar directamente el selector a querySelectorAllsi es compatible ...

— Felix Kling

@FelixKling está bien como parte de selectors4 . Sin embargo, en jQuery es más lento .noty menos legible. Debería haber dicho ": no selector en jQuery"

— Raynos

@Raynos: Ninguna especificación de Selectores ha permitido comillas dentro :not(). Este selector no es nuevo en Selectores 4 ni se ha modificado para permitir comillas. Sin embargo, se ha cambiado para permitir selectores más complejos. A menos que haya entendido mal su comentario ...

— BoltClock

1

@PeterKrauss Acabo de hacer un benchmark jsPerf que marca querySelectorAllcomo el más rápido. No es un punto de referencia del mundo real, pero es de esperar ya que no hay gastos generales de jQuery interno. :not()es de hecho más rápido, presumiblemente porque Sizzle sabe que puede optimizarlo para su usoquerySelectorAll()

— Bojangles

9

var els = toArray(document.getElementsByTagName("div"));
els.splice(els.indexOf(document.getElementById("someId"), 1);

Podrías hacerlo a la antigua. No hay necesidad de jQuery con algo tan simple.

Consejos profesionales:

Un conjunto de elementos dom es solo una matriz, así que use su toArraymétodo favorito en un archivo NodeList.

Agregar elementos a un conjunto es solo

set.push.apply(set, arrOfElements);

Eliminar un elemento de un conjunto es

set.splice(set.indexOf(el), 1)

No puede eliminar fácilmente varios elementos a la vez :(

— Raynos
fuente

1

En la actualidad (2017) quizás el uso de Javascript nativo .querySelector()o .querySelectorAll()con div:not(#myid) es más rápido ... ¿Lo es?

— Peter Krauss

8

$("div:not(#myid)")

^[Doc]

o

$("div").not("#myid")

^[Doc]

son las principales formas de seleccionar todas las identificaciones menos una

Puedes ver la demostración aquí

— génesis
fuente

Hoy (2017) quizás $("div:not(#myid)") sea más rápido ... Verifique la optimización de sizzlejs , cuando use Javascript nativo .querySelector()o .querySelectorAll().

— Peter Krauss

4

   var elements =  $('div').not('#myid');

Esto incluirá todos los divs excepto el que tiene id 'myid'

— Ehtesham
fuente

3

$('div:not(#myid)');

esto es lo que necesitas, creo.

— abhijit
fuente

3

Deberias hacer eso:

$('div:not("#myid")')

— iappwebdev
fuente

3

Usas la .notpropiedad de la biblioteca jQuery:

$('div').not('#myDiv').css('background-color', '#000000');

Véalo en acción aquí . El div #myDiv será blanco.

— Kyle
fuente