Heim  >  Artikel  >  Web-Frontend  >  Detaillierte Erläuterung der Verwendung von jQuery.not(selector)

Detaillierte Erläuterung der Verwendung von jQuery.not(selector)

巴扎黑
巴扎黑Original
2017-06-22 17:51:572400Durchsuche

.not(selector) Gibt zurück: jQuery

Beschreibung: Elemente aus dem Satz übereinstimmender Elemente entfernen.

Version hinzugefügt: 1.0.not (Selektor)

Auswählen

Typ: Selektor oder Element oder Array

enthält Selektorausdruck, DOM-Element oder eine Zeichenfolge von Arrays von Elementen, die dieser Menge entsprechen.

Version erhöht: 1.4. (Funktion)

Funktion

Typ: Funktion(Ganzzahlindex, Elementelement) => Boolean

Funktion, die als Test für jedes Element in der Sammlung verwendet wird. Es akzeptiert zwei Parameter: index, der der Index des Elements im jQuery-Sammlungselement ist, das das DOM-Element ist. Innerhalb dieser Funktion bezieht sich dies auf das aktuelle DOM-Element.

Version hinzugefügt: 1.4 Nicht ausgewählt (ausgewählt)

Ausgewählt

Typ: jQuery

Ein vorhandenes jQuery-Objekt, das mit der aktuellen Gruppe von Elementen übereinstimmt.

Gegeben ein jQuery-Objekt, das eine Menge von DOM-Elementen darstellt.not(), erstellt diese Methode ein neues jQuery-Objekt aus einer Teilmenge übereinstimmender Elemente. Der bereitgestellte Selektor wird für jedes Element getestet. Elemente, die nicht mit dem Selektor übereinstimmen, werden in das Ergebnis einbezogen.

Stellen Sie sich eine Seite mit einer einfachen Liste vor:

fünf

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

Wir können diese Methode auf eine Reihe von Listenelementen anwenden:

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

Das Ergebnis dieses Aufrufs ist ein roter Hintergrund für die Elemente 2 und 4, da sie nicht mit dem Selektor übereinstimmen (zur Erinnerung: even:odd verwendet einen Index von 0).

Bestimmte Elemente entfernen

Die zweite Version der .not()-Methode ermöglicht es uns, Elemente aus der übereinstimmenden Menge zu entfernen, vorausgesetzt, wir haben sie zuvor mit anderen Methoden gefunden. Nehmen wir zum Beispiel an, dass in unserer Liste eine ID auf eines ihrer Elemente angewendet wird:

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

Wir können das dritte Listenelement mithilfe der nativen Funktion JavaScript getElementById() abrufen und dann abrufen it from jQuery Entfernen Sie es aus dem Objekt:

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

Diese Anweisung ändert die Farbe der Elemente 1, 2, 4 und 5. Mit einfacheren jQuery-Ausdrücken könnten wir dasselbe erreichen, aber diese Technik wäre nützlich, wenn beispielsweise andere Bibliotheken Verweise auf reine DOM-Knoten bereitstellen.

Ab jQuery 1.4 kann die .not()-Methode auf die gleiche Weise wie .filter() eine Funktion als Parameter annehmen. Von der Funktion true zurückgegebene Elemente werden aus der gefilterten Sammlung ausgeschlossen; alle anderen Elemente werden eingeschlossen.

Hinweis: Wenn die Zeichenfolge CSS-Selektor an .not() übergeben wird, werden Text- und Kommentarknoten während des Filtervorgangs immer aus dem resultierenden jQuery-Objekt entfernt. Wenn Sie einen bestimmten Knoten oder ein bestimmtes Knotenarray bereitstellen, wird der Text- oder Kommentarknoten nur dann aus dem jQuery-Objekt entfernt, wenn er mit einem der Knoten im gefilterten Array übereinstimmt.

Beispiel:

Fügen Sie einem Div einen Rahmen hinzu, der nicht grün oder blau ist.

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>not demo</title>
  <style>
  div {
    width: 50px;
    height: 50px;
    margin: 10px;
    float: left;
    background: yellow;
    border: 2px solid white;
  }
  .green {
    background: #8f8;
  }
  .gray {
    background: #ccc;
  }
  #blueone {
    background: #99f;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<div></div>
<div id="blueone"></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
 
<script>
$( "div" ).not( ".green, #blueone" )
  .css( "border-color", "red" );
</script>
 
</body>
</html>

Demo:

Entfernen Sie das Element mit der ID „ausgewählt“ aus der Sammlung aller Absätze.

$( "p" ).not( $( "#selected" )[ 0 ] );

Entfernt das Element mit der ID „ausgewählt“ aus der Sammlung aller Absätze.

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

Entfernt alle Elemente, die mit „div p.selected“ übereinstimmen, aus der Gesamtmenge aller Absätze.

$( "p" ).not( $( "div p.selected" ) );

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Verwendung von jQuery.not(selector). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn