So durchlaufen Sie die JQuery-Sammlung

jQuery ist eine beliebte JavaScript-Bibliothek, die die Arbeit mit HTML-Dokumenten und DOM-Elementen einfacher, schneller und einfacher zu warten macht. Seine Selektoren und Betriebsmethoden ermöglichen es Entwicklern, schnell auf Elemente auf der Seite zuzugreifen und diese zu bedienen, wodurch die Entwicklungseffizienz der Entwickler verbessert wird. In der Entwicklung müssen wir häufig einen Stapel von Elementen auf der Seite verarbeiten, z. B. ihre Attribute ändern, Knoten hinzufügen oder löschen usw. Zu diesem Zeitpunkt müssen wir die Durchquerung der jQuery-Sammlung verwenden, um Stapelvorgänge zu implementieren. Wie durchläuft man also die jQuery-Sammlung?

Die jQuery-Sammlung ist ein Array aus DOM-Elementobjekten, die über verschiedene Selektoren abgerufen werden können. Wie folgt:

var $list = $('ul li'); // 获取所有ul下的li元素

Nachdem wir ein jQuery-Objekt erhalten haben, können wir einige von jQuery bereitgestellte Methoden verwenden, um die Sammlung zu durchlaufen und den gewünschten Effekt zu erzielen. Im Folgenden sind einige häufig verwendete Methoden zum Durchlaufen von jQuery-Sammlungen aufgeführt:

1. each()

each()

each()方法用于遍历数组或对象，它可以迭代以上获取到的$list集合，对每个元素执行指定的函数。

语法：

$.each(array, function(index, value) {
  // 处理函数体
});

示例代码：

$list.each(function(index) {
  console.log(index + ": " + $(this).text());
});

其中，each()方法的参数是一个函数，该函数将在each()方法中遍历的每个元素上执行。该函数提供两个参数：

• index：当前元素的索引。
• value：当前元素的值。

2. map()

map()方法也可以用于遍历数组，它将一个数组转换成另一个数组，执行函数后返回一个新数组。

语法：

$.map(array, function(value, indexOrkey) {
  // 处理函数体
});

示例代码：

var newArr = $list.map(function(index) {
  return $(this).text();
});
console.log(newArr);

3. filter()

filter()方法用于筛选集合中满足指定条件的元素。它可以根据回调函数返回的值来确定是否将该元素包含在新的集合中。

语法：

$(selector).filter(function(index){
  // 处理函数体
});

示例代码：

var $filtered = $list.filter(function(index) {
  return $(this).hasClass('active');
});
console.log($filtered);

filter()方法会返回满足条件的元素，这些元素可以是与原来的集合中的元素相同的对象，也可以是一个新的jQuery对象。

4. not()

not()方法排除集合中指定的元素，返回一个不包含指定元素的新的集合。

语法：

$(selector).not(selector);

示例代码：

var $notFiltered = $list.not('.disabled');
console.log($notFiltered);

not()方法还可以接受一个函数作为参数，该函数将运行在每个元素上，如果返回的值是true，那么该元素将会被包含在新的集合中。

var $notFiltered = $list.not(function(index) {
  return $(this).hasClass('active');
});
console.log($notFiltered);

5. find()

find()方法筛选当前集合中的所有后代元素，返回匹配指定选择器的元素集合。

语法：

$(selector).find(selector);

示例代码：

var $found = $list.find('a');
console.log($found);

在这些示例中，我们看到jQuery提供了多种方法来遍历集合，这使得在处理一个jQuery集合时，代码编写更加简单。既然这些方法都是从Array.prototype和Object.prototypeeach( ) Die -Methode wird zum Durchlaufen eines Arrays oder Objekts verwendet. Sie kann die oben erhaltene $list-Sammlung durchlaufen und die angegebene Funktion für jedes Element ausführen.

#🎜🎜#Syntax: #🎜🎜#rrreee#🎜🎜#Beispielcode: #🎜🎜#rrreee#🎜🎜#Unter diesen ist der Parameter der Methode each() eine Funktion. Diese Funktion wird für jedes Element ausgeführt, das in der Methode every() durchlaufen wird. Diese Funktion stellt zwei Parameter bereit: #🎜🎜#

#🎜🎜#index: der Index des aktuellen Elements. #🎜🎜#value: Der Wert des aktuellen Elements.

#🎜🎜#map()

#🎜🎜#map() Die Methode code> kann auch zum Durchlaufen von Arrays verwendet werden, wodurch ein Array in ein anderes Array konvertiert wird und nach Ausführung der Funktion ein neues Array zurückgegeben wird. #🎜🎜##🎜🎜#Syntax: #🎜🎜#rrreee#🎜🎜#Beispielcode: #🎜🎜#rrreee<ol start="3">#🎜🎜#<code>filter() #🎜🎜#Die Methode filter() wird verwendet, um Elemente in der Sammlung zu filtern, die bestimmte Bedingungen erfüllen. Es kann anhand des von der Rückruffunktion zurückgegebenen Werts bestimmen, ob das Element in die neue Sammlung aufgenommen werden soll. #🎜🎜##🎜🎜#Syntax: #🎜🎜#rrreee#🎜🎜#Beispielcode: #🎜🎜#rrreee#🎜🎜#Die Methode filter() gibt Elemente zurück, die die Bedingungen erfüllen Diese Das Element kann dasselbe Objekt wie das Element in der ursprünglichen Sammlung oder ein neues jQuery-Objekt sein. #🎜🎜#

#🎜🎜#not()

#🎜🎜#not()Methodenausschluss Das angegebene Element in der Sammlung gibt eine neue Sammlung zurück, die das angegebene Element nicht enthält. #🎜🎜##🎜🎜#Syntax: #🎜🎜#rrreee#🎜🎜#Beispielcode: #🎜🎜#rrreee#🎜🎜#Die Methode not() kann eine Funktion auch als akzeptieren Parameter: Diese Funktion wird für jedes Element ausgeführt. Wenn der zurückgegebene Wert wahr ist, wird das Element in die neue Sammlung aufgenommen. #🎜🎜#rrreee

#🎜🎜#find()

#🎜🎜#find() Methode Filtert alle untergeordneten Elemente in der aktuellen Sammlung und gibt eine Sammlung von Elementen zurück, die dem angegebenen Selektor entsprechen. #🎜🎜##🎜🎜#Syntax: #🎜🎜#rrreee#🎜🎜#Beispielcode: #🎜🎜#rrreee#🎜🎜#In diesen Beispielen sehen wir, dass jQuery mehrere Methoden zum Durchlaufen von Sammlungen bereitstellt, was das Schreiben erleichtert Code einfacher beim Umgang mit einer jQuery-Sammlung. Da diese Methoden von Array.prototype und Object.prototype geerbt werden, funktionieren sie in jQuery genauso wie natives JavaScript. Sobald Sie sie beherrschen, können Sie nicht nur mit Sammlungen in jQuery arbeiten, sondern sie auch für den Betrieb in nativem JavaScript verwenden. #🎜🎜#

Das obige ist der detaillierte Inhalt vonSo durchlaufen Sie die JQuery-Sammlung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!