jQuery doorzoeken - not() methode

Voorbeeld

Verwijder de paragraaf met id "selected" uit de verzameling van alle paragrafen:

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

Probeer het zelf uit

Definitie en gebruik

not() Verwijder elementen uit de verzameling van overeenkomende elementen.

Syntaxis 1

.not(selector)
Parameters Beschrijving
selector Een stringwaarde die een selector-expressie bevat die elementen moet matchen.

Syntaxis 2

.not(element)
Parameters Beschrijving
element Een of meerdere DOM-elementen die moeten worden verwijderd uit de overeenkomstige verzameling.

Syntaxis 3

.not(function(index))
Parameters Beschrijving
function(index) De functie die elke element van de verzameling controleert. this is het huidige DOM-element.

Uitleg

Als een jQuery-object een verzameling DOM-elementen vertegenwoordigt, maakt de .not() methode een nieuwe jQuery-object van een subset van de overeenkomende elementen. De toepaste selector controleert elke element; elementen die niet overeenkomen met de selector worden opgenomen in het resultaat.

Denk na over de volgende pagina met een eenvoudige lijst:

<ul>
  <li>lijst item 1</li>
  <li>lijst item 2</li>
  <li>lijst item 3</li>
  <li>lijst item 4</li>
  <li>lijst item 5</li>
</ul>

We kunnen deze methode toepassen op de verzameling van lijstitems:

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

Probeer het zelf uit

Het resultaat van deze aanroep is dat item 2 en 4 rood achtergrond worden ingesteld, omdat ze niet overeenkomen met de selector (onthoud, :even en :odd gebruiken een index gebaseerd op 0).

Verwijder specifieke elementen

De tweede versie van de .not() methode stelt ons toe om elementen uit de overeenkomstige verzameling te verwijderen, aangezien we deze elementen al eerder hebben gevonden met andere middelen. Bijvoorbeeld, stel voor dat een lijst al een id heeft toegepast op een van de projecten:

<ul>
  <li>lijst item 1</li>
  <li>lijst item 2</li>
  <li id="notli">lijst item 3</li>
  <li>lijst item 4</li>
  <li>lijst item 5</li>
</ul>

We kunnen de originele JavaScript-functie getElementById() gebruiken om de derde lijstitem te lezen en deze dan uit het jQuery-object te verwijderen:

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

Probeer het zelf uit

Deze statement wijzigt de achtergrondkleur van items 1, 2, 3 en 5. We kunnen dezelfde actie uitvoeren met een eenvoudiger jQuery-expressie, maar deze techniek is nuttig wanneer andere bibliotheken referenties bieden aan puur DOM-knooppunten.

Voor jQuery 1.4 kan de .not() methode een functie als parameter gebruiken, net als de .filter() methode. De elementen waar de functie true retourneert, worden uit de filterverzameling verwijderd; alle andere elementen worden erin opgenomen.