Der Inhalt dieses Artikels befasst sich mit den häufig verwendeten Methoden in jQuery. Ich hoffe, dass sie für Sie hilfreich sind .
Durchlaufe ein jQuery-Objekt und führe eine Funktion für jedes passende Element aus
$('p').each(function(idx,node){
$(node).text(idx + ':' + 'hello')
})jQuery.extend([deep,] target [, object1 ] [, objectN ] )
Mehrere Objekte zusammenführen und alle Attribute zum ersten Objekt hinzufügen
Wenn wir zwei oder mehr Objekte für $.extend() bereitstellen, werden dem Ziel alle Eigenschaften des Objekts hinzugefügt Objekt (Zielparameter).
Wenn nur ein Argument für $.extend() bereitgestellt wird, bedeutet dies, dass das Zielargument weggelassen wird. In diesem Fall wird das jQuery-Objekt selbst standardmäßig auf das Zielobjekt gesetzt. Auf diese Weise können wir neue Funktionen unter dem jQuery-Namespace hinzufügen. Dies ist nützlich für Plugin-Entwickler, die jQuery neue Funktionen hinzufügen möchten. Das heißt, {} ist das Standardattribut. Der Benutzer legt das Attribut fest und überschreibt das Standardattribut. Die Methode
var object = $.extend({}, object1, object2)
var object1 = { apple: 0, banana: { weight: 52, price: 100 }, cherry: 97
}var object2 = { banana: { price: 200 }, durian: 100
}
// 将obj2合并到obj1上的案例
$.extend( object1, object2 ).clone() kopiert den Satz aller übereinstimmenden Elemente, einschließlich aller übereinstimmenden Elemente, untergeordneter Elemente übereinstimmender Elemente und Text, tiefgreifend Knoten.
Wenn wir ein Element auf der Seite an einer anderen Stelle im DOM einfügen, wird es normalerweise von der alten Stelle verschoben, ähnlich einem Schereffekt.
Zum Beispiel:
<div class="container">
<div class="hello">Hello</div>
<div class="world">World</div></div>
$('.hello').appendTo('.world');<div class="container"> <div class="world">
World <div class="hello">Hello</div> </div></div>Wenn Sie kopieren statt ausschneiden müssen, können Sie den Code wie folgt schreiben:
$('.hello').clone().appendTo('.world')
Von Ein bestimmtes Element in der angegebenen Sammlung suchen indexTiefgestellt
Ohne Parameter das erste Element zurückgebenindex
Wenn der Parameter ist DOM-Objekt oder jQuery-Objekt, dann geben Sie den Parameter in der Sammlung zurück index
Wenn der Parameter ein Selektor ist, geben Sie das erste passende Element zurück index -1
$('p').eq(2).index() //2 $('.ok').index('p') //获取p标签中的.ok的下标
entspricht nativem JS. document.onDOMContentLoaded
gibt eine Funktion an, die ausgeführt werden soll, wenn das DOM bereit ist.
Wenn beispielsweise der ausgeführte Code nach dem Laden des Elements verwendet werden muss (z. B. muss das Ermitteln der Bildgröße nach dem Laden des Bildes erfolgen), müssen Sie diesen Code einfügen das Ladeereignis.
Die folgenden beiden Schreibweisen sind gleichwertig
$(document).ready(function(){
})
$(function(){
})Beispiel
$(function(){ console.log('ready')
})Wir brauchen es oft in Entwicklung Bindet Handler an Ereignisse für einige Elemente. Das Problem besteht jedoch darin, dass das Element keine Wirkung hat, wenn es nicht auf der Seite geladen wurde, das Bindungsereignis jedoch ausgeführt wurde. Diese beiden Ereignisse werden grob verwendet, um eine solche Situation zu vermeiden. Fügen Sie die gebundenen Funktionen in die Rückrufe dieser beiden Ereignisse ein, um sicherzustellen, dass die Ereignisfunktionen gebunden werden können, nachdem bestimmte Elemente der Seite geladen wurden. Was ist der Unterschied zwischen window.onload und $(document).ready? document.onDOMContentLoadedWas ist mit
Ausführungszeiten variieren
window.onload muss warten, bis alle Elemente auf der Seite, einschließlich Bilder, geladen sind, bevor es ausgeführt werden kann.
$(document).ready() ist eine DOM-Struktur, die nach Abschluss des Zeichnens ausgeführt wird, ohne darauf zu warten, dass alle Seitenelemente geladen werden.
Der Unterschied bei der wiederholten Ausführung der beiden Methoden
Sie können nicht mehrere window.onloads gleichzeitig schreiben. Wenn es mehrere window.onload-Methoden gibt, nur die letzte
$ (Dokument) wird ausgeführt. Mehrere ready() können gleichzeitig geschrieben und alle ausgeführt werden.
Wenn beide Methoden geschrieben sind, wird $(document).ready() vor window.onload ausgeführt.
Vereinfachtes Schreiben
Es gibt kein vereinfachtes Schreiben für window.onload entspricht document.onDOMContentLoaded in jQuery. Das DOMContentLoaded-Ereignis wird ausgelöst, nachdem das ursprüngliche HTML-Dokument vollständig geladen und analysiert wurde, ohne darauf zu warten, dass Stylesheets, Bilder und Subframes vollständig geladen werden. .ready()
Die meisten Browser beginnen mit Eine ähnliche Funktionalität wird in Form des DOMContentLoaded-Ereignisses bereitgestellt. Allerdings ist .ready() von jQuery Methoden haben einen wichtigen und nützlichen Unterschied: Wenn das DOM bereit ist, lädt der Browser es, bevor der Code .ready(handler) aufruft. DOMContentLoaded , dann wird der Funktionshandler weiterhin ausgeführt. Im Gegensatz dazu wurde der DOMContentLoaded-Ereignis-Listener, der nach der Auslösung des Ereignisses hinzugefügt wurde, nie ausgeführt.
document.onDOMContentLoaded ist also nicht gleichbedeutend mit .ready() in jQuery, es kann nur gesagt werden, dass es sich um eine ähnliche Methode handelt.
Verwandte Empfehlungen:
Implementierung und Verwendung des ungeordneten Bildvorladens in jquery
Zwischen jQuery-Objekt und nativem DOM-Objekt Der Unterschied und die Konvertierung
Das obige ist der detaillierte Inhalt vonWelche Methoden gibt es in jQuery? Häufig verwendete Methoden in jQuery (mit Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
