Der Unterschied zwischen $('#id') und document.getElementById('id') in jquery

Früher dachte ich, dass $("#id") in jquery und document.getElementByIdx_x("id") den gleichen Effekt haben Spezialeffekte Erst dann habe ich herausgefunden, dass dies nicht der Fall ist Objekt]

2. Alert(document.getElementById("p")) erhält [object HTMLpElement]

3. Alert($("#p")[0]) oder Alert($("#p").get(0)) erhält [object HTMLpElement]

Grundinterpretation:

document.getElementById() gibt DOM-Objekt, während $() ein

jQuery-Objekt

zurückgibt

Was ist ein jQuery-Objekt?
---Es ist das Objekt, das durch Umschließen des DOM-Objekts durch jQuery generiert wird. Das jQuery-Objekt ist einzigartig für jQuery und kann Methoden in jQuery verwenden.
Zum Beispiel:
$("#test").html() bedeutet: Holen Sie sich den HTML-Code im Element mit ID-Test. Unter diesen ist html() eine Methode in jQuery
Dieser Code entspricht der Verwendung von DOM zum Implementieren des Codes:
document.getElementById ("id" ).innerHTML;
Obwohl Obwohl jQuery-Objekte nach dem Umschließen von DOM-Objekten generiert werden, kann jQuery keine Methoden von DOM-Objekten verwenden. Ebenso können DOM-Objekte keine Methoden in jQuery verwenden Melden Sie einen Fehler. Zum Beispiel: $("#test").innerHTML, document.getElementById("id").html() und andere Schreibmethoden sind falsch.
Zu beachten ist außerdem, dass das durch die Verwendung von #id als Selektor erhaltene jQuery-Objekt und das durch document.getElementById("id") erhaltene DOM-Objekt nicht gleichwertig sind. Bitte sehen Sie sich die Umrechnung zwischen den beiden unten an.
Auch Obwohl jQuery unterschiedlich, aber verwandt ist, können jQuery-Objekt und DOM-Objekt auch ineinander konvertiert werden. Bevor wir die beiden konvertieren, geben wir zunächst eine Konvention an: Wenn man ein jQuery-Paar erhält Objekt, dann fügen wir $ vor der Variablen hinzu, wie zum Beispiel: var $variab = jQuery-Objekt; wenn das DOM-Objekt erhalten wird, ist es dasselbe wie üblich: var variab = DOM-Objekt; diese Konvention dient nur der Vereinfachung der Erklärung und Unterscheidung und ist in der tatsächlichen Verwendung nicht vorgeschrieben.

JQuery-Objekt in DOM-Objekt konvertieren:
Zwei Konvertierungsmethoden konvertieren ein jQuery-Objekt in ein DOM-Objekt: [index] und .get(index); Das Objekt ist ein Datenobjekt und das entsprechende DOM-Objekt kann über die Methode [index] abgerufen werden.
Zum Beispiel: var $v =$("#v"); //jQuery object
var v=$v[0]; //DOM object
alert(v.checked) //Detect this Unabhängig davon, ob das Kontrollkästchen aktiviert ist
(2) jQuery selbst stellt über die .get(index)-Methode das entsprechende DOM-Objekt bereit
Zum Beispiel: var $v=$("#v"); /jQuery object
var v=$v.get(0); //DOM-Objekt
alert(v.checked) //Erkennen, ob dieses Kontrollkästchen aktiviert ist


DOM-Objekt konvertiert in ein jQuery-Objekt: Für ein DOM-Objekt müssen Sie das DOM-Objekt nur mit $() umschließen, um ein jQuery-Objekt zu erhalten. $(DOM-Objekt)
Zum Beispiel: var v=document.getElementById("v"); //DOM-Objekt
var $v=$(v); //jQuery-Objekt
Nach der Konvertierung Sie können gerne die Methoden von jQuery verwenden.
Mit den oben genannten Methoden können Sie
jQuery-Objekte und DOM-Objekte beliebig ineinander konvertieren. Es muss noch einmal betont werden, dass nur DOM-Objekte Methoden im DOM verwenden können und jQuery-Objekte keine Methoden im DOM verwenden können.
Im Folgenden sind weitere verwandte Verwendungsmethoden aufgeführt:

1. DOM-Objekt in jQuery-Objekt konvertieren Gewöhnliche Dom-Objekte können im Allgemeinen über $() in jQuery-Objekte konvertiert werden.

Zum Beispiel: $(document.getElementById("msg"))
Was zurückgegeben wird, ist das jQuery-Objekt, und jQuery-Methoden können verwendet werden.


2. Konvertieren Sie ein jQuery-Objekt in ein DOM-Objekt Weil das jQuery-Objekt selbst eine Sammlung ist. Wenn das jQuery-Objekt in ein Dom-Objekt umgewandelt werden soll, muss daher eines der Elemente abgerufen werden, was im Allgemeinen über einen Index abgerufen werden kann.
Zum Beispiel: $("#msg")[0], $("p").eq(1)[0], $("p").get()[1], $("td " )[5]

Dies sind Dom-Objekte. Sie können Methoden in Dom verwenden, aber Sie können keine jQuery-Methoden mehr verwenden.

Die folgenden Schreibmethoden sind korrekt:
$("#msg").html();
$("#msg")[0].innerHTML; #msg").eq(0)[0].innerHTML;
$("#msg").get(0).innerHTML;

3. Zwei Methoden zum Abrufen des Objekts: Wenn

vorhanden ist

Nach ID:

Document.getElementById('formid');

　$('#formid')

Nach Namen

　document.getElementsByName('formName')[ 0]

　$("form[name='formName']")

Jquery-inhärente Methode:

document.getElementById() gibt ein DOM-Objekt zurück, während $() eine jQuery zurückgibt Objekt

Was ist ein jQuery-Objekt?
---Es ist das Objekt, das durch Umschließen des DOM-Objekts durch jQuery generiert wird. Das jQuery-Objekt ist einzigartig für jQuery und kann Methoden in jQuery verwenden.
Zum Beispiel:
$("#test").html() bedeutet: Holen Sie sich den HTML-Code im Element mit ID-Test. Unter diesen ist html() eine Methode in jQuery
Dieser Code entspricht der Verwendung von DOM zum Implementieren des Codes:
document.getElementById ("id" ).innerHTML;
Obwohl Obwohl jQuery-Objekte nach dem Umschließen von DOM-Objekten generiert werden, kann jQuery keine Methoden von DOM-Objekten verwenden. Ebenso können DOM-Objekte keine Methoden in jQuery verwenden Melden Sie einen Fehler. Zum Beispiel: $("#test").innerHTML, document.getElementById("id").html() und andere Schreibmethoden sind falsch.
Zu beachten ist außerdem, dass das durch die Verwendung von #id als Selektor erhaltene jQuery-Objekt und das durch document.getElementById("id") erhaltene DOM-Objekt nicht gleichwertig sind. Bitte sehen Sie sich die Umrechnung zwischen den beiden unten an.
Auch Obwohl jQuery unterschiedlich, aber auch verwandt ist, können jQuery-Objekte und DOM-Objekte auch ineinander konvertiert werden. Bevor wir die beiden konvertieren, geben wir zunächst eine Konvention an: Wenn man ein jQuery-Paar erhält Objekt, dann fügen wir $ vor der Variablen hinzu, wie zum Beispiel: var $variab = jQuery-Objekt; wenn das DOM-Objekt erhalten wird, ist es dasselbe wie üblich: var variab = DOM-Objekt; diese Konvention dient nur der Vereinfachung der Erklärung und Unterscheidung und ist in der tatsächlichen Verwendung nicht vorgeschrieben.

JQuery-Objekt in DOM-Objekt konvertieren:
Zwei Konvertierungsmethoden konvertieren ein jQuery-Objekt in ein DOM-Objekt: [index] und .get(index); Das Objekt ist ein Datenobjekt und das entsprechende DOM-Objekt kann über die Methode [index] abgerufen werden.
Zum Beispiel: var $v =$("#v"); //jQuery object
var v=$v[0]; //DOM object
alert(v.checked) //Detect this Ob das Kontrollkästchen aktiviert ist
(2)jQuery selbst stellt das entsprechende DOM-Objekt über die .get(index)-Methode bereit
Zum Beispiel: var $v=$("#v"); //jQuery-Objekt
var v=$v.get(0); //DOM-Objekt
alert(v.checked) //Erkennen, ob dieses Kontrollkästchen aktiviert ist


DOM-Objekt in jQuery-Objekt konvertiert: Bei einem DOM-Objekt müssen Sie das DOM-Objekt nur mit $() umschließen, um ein jQuery-Objekt zu erhalten. $(DOM-Objekt)
Zum Beispiel: var v=document.getElementById("v"); //DOM-Objekt
var $v=$(v); //jQuery-Objekt
Nach der Konvertierung Sie können gerne die Methoden von jQuery verwenden.
Mit den oben genannten Methoden können jQuery-Objekte und DOM-Objekte beliebig ineinander konvertiert werden. Es muss noch einmal betont werden, dass nur DOM-Objekte Methoden im DOM verwenden können und jQuery-Objekte keine Methoden im DOM verwenden können.

Die folgenden sind weitere verwandte Verwendungsmethoden:

1. DOM-Objekt in jQuery-Objekt konvertieren Gewöhnliche Dom-Objekte können im Allgemeinen über $() in jQuery-Objekte konvertiert werden.

Zum Beispiel: $(document.getElementById("msg"))
Was zurückgegeben wird, ist das jQuery-Objekt, und jQuery-Methoden können verwendet werden.


2. Konvertieren Sie ein jQuery-Objekt in ein DOM-Objekt Weil das jQuery-Objekt selbst eine Sammlung ist. Wenn das jQuery-Objekt in ein Dom-Objekt umgewandelt werden soll, muss daher eines der Elemente abgerufen werden, was im Allgemeinen über einen Index abgerufen werden kann.
Zum Beispiel: $("#msg")[0], $("p").eq(1)[0], $("p").get()[1], $("td " )[5]

Dies sind Dom-Objekte. Sie können Methoden in Dom verwenden, aber Sie können keine jQuery-Methoden mehr verwenden.

Die folgenden Schreibmethoden sind korrekt:
$("#msg").html();
$("#msg")[0].innerHTML; #msg").eq(0)[0].innerHTML;
$("#msg").get(0).innerHTML;

3. Zwei Methoden zum Abrufen des Objekts: Wenn

vorhanden ist

Nach ID:

Document.getElementById('formid');

　$('#formid')

Mit Namen

　　document.getElementsByName('formName')[0]

$("form[name='formName']")

Das obige ist der detaillierte Inhalt vonDer Unterschied zwischen $('#id') und document.getElementById('id') in jquery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!