Detaillierter Beispielcode für die Konvertierung von JQuery-Objekten und DOM-Objekten ineinander

jQuery-Objekte sind Objekte, die durch Umschließen von DOM-Objekten mit jQuery generiert werden. Das jQuery-Objekt ist einzigartig für jQuery, kann jedoch keine DOM-Methoden verwenden, zum Beispiel: $("#img").attr("src","test.jpg"); img") ist das jQuery-Objekt.

DOM-Objekte sind einige in Javascript inhärente Objektoperationen. DOM-Objekte können in Javascript inhärente Methoden verwenden, jedoch keine Methoden in jQuery. Zum Beispiel: document.getElementById("img").src = "test.jpg"; document.getElementById("img") ist hier das DOM-Objekt.

$("#img").attr("src","test.jpg"); entspricht document.getElementById("img").src = "test.jpg"; aber $("#img").src = "test.jpg"; oder document.getElementById("img").attr("src","test.jpg");

Ein weiteres Beispiel ist dieses. Wenn ich jQuery schreibe, schreibe ich oft so: this.attr("src","test.jpg"); aber es ist tatsächlich ein DOM-Objekt , und .attr( „src“, „test.jpg“) ist eine jQuery-Methode, daher ist ein Fehler aufgetreten. Um dieses Problem zu lösen, müssen Sie das DOM-Objekt in ein jQuery-Objekt konvertieren, z. B. $(this).attr("src","test.jpg");

1 Konvertieren Sie das DOM-Objekt in ein jQuery-Objekt

Für ein DOM-Objekt, das bereits ein DOM-Objekt ist, müssen Sie das DOM-Objekt nur mit $() umschließen, um ein jQuery-Objekt zu erhalten, $(DOM-Objekt) Hinweis : var ist eine definierte Variable

Zum Beispiel:

var v = document.getElementById("v"); //DOM对象
var $v = $(v); //jQuery 对象

Nach der Konvertierung können Sie jQuery-Methoden nach Belieben verwenden.

2. Konvertieren eines jQuery-Objekts in ein DOM-Objekt

Zwei Konvertierungsmethoden beziehen sich auf die Konvertierung eines jQuery-Objekts in ein DOM-Objekt: [index] und .get(index);

(1) Das jQuery-Objekt ist ein Datenobjekt, und das entsprechende DOM-Objekt kann über die Methode [index] abgerufen werden.

Zum Beispiel:

var $v = $("#v"); //jQuery 对象
var v = $v[0]; //DOM 对象
alert(v.checked); //检测这个checkbox是否被选中

(2) jQuery selbst stellt das entsprechende DOM-Objekt über die .get(index)-Methode bereit

Zum Beispiel:

var $v = $("#v"); //jQuery 对象
var v = $v.get(0); //DOM对象 ( $v.get()[0] 也可以 )
alert(v.checked); //检测这个 checkbox 是否被选中

Mit den oben genannten Methoden können jQuery-Objekte und DOM-Objekte nach Belieben ineinander konvertiert werden Hervorzuheben ist noch einmal: DOM-Objekte Es können nur Methoden im DOM verwendet werden. jQuery-Objekte können keine Methoden im DOM verwenden.

Das obige ist der detaillierte Inhalt vonDetaillierter Beispielcode für die Konvertierung von JQuery-Objekten und DOM-Objekten ineinander. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!