Heim > Web-Frontend > js-Tutorial > JQuery Wählen Sie die ersten x Elemente der bestimmten Klasse aus

JQuery Wählen Sie die ersten x Elemente der bestimmten Klasse aus

Christopher Nolan
Freigeben: 2025-03-01 00:44:34
Original
359 Leute haben es durchsucht

JQuery Wählen Sie die ersten x Elemente der bestimmten Klasse aus

Ich habe einen kleinen JQuery -Funktionsaufruf .GetRange () geschrieben, der eine bestimmte Anzahl von DOM -Elementen zurückgibt gegen einen JQuery -Selektor (dh Elemente basierend auf einer bestimmten Klasse oder ID). Es verwendet die Funktion jQuery.get () und ist im Grunde eine Erweiterung davon, ermöglicht jedoch eine Reihe von Elementen, die zurückgegeben werden können. Erstens sollten Sie wissen, dass Sie die ersten und letzten Elemente wie SO bekommen:
<span>var firstSpan = $('span.class:first'),
</span>    lastSpan <span>= $('span.class:last');</span>
Nach dem Login kopieren
Um alle Elemente zu erhalten, die einer bestimmten Klasse wie SO entsprechen:
<span>var allSpans = $('span.class').get();</span>
Nach dem Login kopieren
oder das nte Element wie SO:
<span>var firstSpan = $('span.class').get(0),
</span>    secondSpan <span>= $('span.class').get(1);
</span>    <span>//etc...</span>
Nach dem Login kopieren
Aber wie kann man die ersten 10 Elemente oder Elemente 10-20 sagen? Es wäre schön, so etwas wie zu gehen:
<span>var mySpans = $('span.class').get(0,10);</span>
Nach dem Login kopieren
Leider lässt die Funktion .get () nicht zu, dass ein Bereich übergeben wird, sondern nur ein einzelner Index. Hier ist also mein Versuch, die Funktion jQuery .get () zu verwenden, um eine Reihe von Elementen einzuschließen.
<span>(function($)
</span><span>{
</span>  <span>//function that gets a range of dom elements against a jQuery selector
</span>  <span>//returns an array of dom elements
</span>  $<span>.fn.getRange = function(start<span>,end</span>)
</span>  <span>{
</span>    <span>var elems = [];
</span>    <span>for ( var i = start; i < = end; i++ )
</span>    <span>{
</span>      elems<span>.push(this.get(i));
</span>    <span>}
</span>    <span>return elems;
</span>  <span>};
</span>
  <span>//testing
</span>  <span>console.log($('div').getRange(1,10));
</span>  <span>console.log($('div').getRange(10,20));
</span>
<span>})(jQuery);</span>
Nach dem Login kopieren
Ausgabe: JQuery Wählen Sie die ersten x Elemente der bestimmten Klasse aus Es funktioniert so, aber ich denke, es ist keine optimale Lösung. Weiß jemand also einen besseren Weg, dies zu erreichen?

häufig gestellte Fragen (FAQs) zu JQuery Wählen Sie Elemente mit spezifischer Klasse

aus

Wie kann ich das erste Element mit einer bestimmten Klasse in jQuery auswählen? Der Klassenauswahl ist mit einem Zeitraum (.) Bezeichnet, gefolgt vom Klassennamen, und der erste Selektor wird verwendet, um das erste Element des angegebenen Typs auszuwählen. Hier ist ein Beispiel:

$ (". MyClass: First"). DoSomething ();
In diesem Beispiel wird das erste Element mit der Klasse „Myclass“ ausgewählt. Der Klassenauswahl () wird verwendet, um alle Elemente mit einer bestimmten Klasse auszuwählen. Hier ist ein Beispiel:

$ (". Myclass"). Dosenthing ();

In diesem Beispiel werden alle Elemente mit der Klasse „Myclass“ ausgewählt. Der: Last Selector wird verwendet, um das letzte Element des angegebenen Typs auszuwählen. Hier ist ein Beispiel:

$ (". MyClass: last"). Dosenthing ();

In diesem Beispiel wird das letzte Element mit der Klasse "Myclass" ausgewählt. Sie müssen nur die Klassenauswahl einstellen. Hier ist ein Beispiel:

$ (". Class1.class2"). Dosomething ();
In diesem Beispiel wird das Element mit "Class1" als auch "class2" ausgewählt.

Wie kann ich ein Element mit einer bestimmten Klasse innerhalb eines bestimmten Elements in jQuery auswählen? Hier ist ein Beispiel:

$ ("div .myclass"). Dosomething ();
In diesem Beispiel wird das Element mit der Klasse „Myclass“ innerhalb eines Div -Elements ausgewählt. Sie können die Kombination des Klassenauswahl und des versteckten Selektors verwenden. Hier ist ein Beispiel:

$ (". Myclass: versteckt"). Dosenthing ();

In diesem Beispiel werden die verborgenen Elemente mit der Klasse „Myclass“ ausgewählt. Klassenauswahl und der: sichtbare Selektor. Hier ist ein Beispiel:

$ (". MyClass: sichtbar"). Dosentwett ();

In diesem Beispiel werden die sichtbaren Elemente mit der Klasse „Myclass“ ausgewählt. Sie können die Kombination des Klassenauswahl und dem: Behinderten Selektor verwenden. Hier ist ein Beispiel:

$ (". Myclass: Behindert"). DoSomething ();
In diesem Beispiel werden die deaktivierten Elemente mit der Klasse „MyClass“ ausgewählt. Selektor und der: Aktivierte Selector. Hier ist ein Beispiel:

$ (". MyClass: aktiviert"). DoSomething ();

In diesem Beispiel werden die aktivierten Elemente mit der Klasse „MyClass“ ausgewählt. Sie können die Kombination aus dem Klassenauswahl und dem geprüften Selektor verwenden. Hier ist ein Beispiel:


$ (". MyClass: Checked"). DoSomething ();
In diesem Beispiel werden die geprüften Elemente mit der Klasse „MyClass“ ausgewählt.

Das obige ist der detaillierte Inhalt vonJQuery Wählen Sie die ersten x Elemente der bestimmten Klasse aus. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
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
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage