Grundlegendes jQuery-Tutorial zum Betrieb verschiedener Elemente_jquery

Die Beispiele in diesem Artikel beschreiben die Vorgänge von jQuery für Elemente, einschließlich grundlegender Vorgänge, der Auswahl der zu bearbeitenden Elemente und der Verarbeitung von DOM-Elementen. Es hat einen guten Referenzwert zum Erlernen von jQuery. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

1. Grundlagen

jquery-Objektsatz:

$(): Sammlung von JQuery-Objekten

Elemente im JQuery-Objektsatz abrufen:

Rufen Sie das Javascript-Element im Wrapper mit dem Index ab:

var temp = $('img[alt]')[0]

Verwenden Sie die Get-Methode von JQuery, um die Javascript-Elemente im JQuery-Objektsatz abzurufen:

var temp = $('img[alt]').get(0)

Verwenden Sie die eq-Methode von jquery, um die Jquery-Objektelemente im JQuery-Objektsatz abzurufen:

$('img[alt]').eq(0)
$('img[alt]').first()
$('img[alt]').last()

JQuery-Objektsatz in Javascript-Array konvertieren:

var arr = $('label+button').toArray()

Alle Schaltflächenelemente derselben Ebene hinter der Beschriftung werden in JavaScript-Arrays umgewandelt

Index des JQuery-Objektsatzes:
var n = $('img').index($('img#id')[0]) Hinweis: Der index()-Parameter ist ein Javascript-Element
var n = $('img').index('img#id') entspricht der vorherigen Zeile. Wenn nicht gefunden, wird -1
zurückgegeben var n = $('img').index() ruft den Index von img im gleichen Ebenenelement

ab

Fügen Sie weitere JQuery-Objektsätze zum JQuery-Objektsatz hinzu:
Verwenden Sie Kommas:

$('img[alt],img[title]')

Verwenden Sie die Add-Methode:

$('img[alt]').add('img[title]')

Verwenden Sie verschiedene Methoden für verschiedene JQuery-Objekte:

$('img[alt]').addClass('thickBorder').add('img[title]').addClass('');

Neu erstellte Elemente zum JQuery-Objektsatz hinzufügen:

$('p').add('<div></div>');

Elemente aus dem JQuery-Objektsatz löschen:

$('img[title]').not('[title*=pu]')
$('img').not(function(){return !$(this).hasClass('someClassname')})

Jquery-Objektsatz filtern:
$('td').filter(function(){return this.innerHTML.match(^d $)}) filtert td

mit Zahlen

Erhalten Sie eine Teilmenge des JQuery-Objektsatzes

$('*').slice(0,4) Ein neuer Satz von JQuery-Objekten, der die ersten 4 Elemente enthält
$('*').slice(4) Ein neuer Satz von JQuery-Objekten, der die ersten 4 Elemente enthält
$('div').has('img[alt]')

Elemente im JQuery-Objektsatz konvertieren:

var allIds = $('div').map(function(){
 return (this.id==undefined) ? null : this.id;
}).get();

Das obige Beispiel kann über die get-Methode in ein Javascript-Array umgewandelt werden.

Durchlaufen Sie die Elemente im JQuery-Objektsatz:

$('img').each(function(n){
 this.alt = '这是第['+n+']张图片，图片的id是' + this.id;
})
$([1,2,3]).each(function(){alert(this);})

Erhalten Sie eine Reihe von JQuery-Objekten mithilfe von Beziehungen zwischen Elementen:

$(this).closest('div') Zum Beispiel, in welchem ​​Div die ausgelöste Schaltfläche vorkommt
$(this).siblings('button[title="Close"]')Alle Geschwisterelemente, außer sich selbst
$(this).children('.someclassname')Alle untergeordneten Knotenelemente, mit Ausnahme doppelter untergeordneter Knoten
$(this).closest('') liegt nahe am Vorgängerelement
$(this).contents() ist eine Reihe von JQuery-Objekten, die aus Elementinhalten bestehen. Sie können beispielsweise den Inhalt des