Jede Konvertierung zwischen Jquery-Objekten und DOM-Objekten

Jede Konvertierung zwischen Jquery-Objekten und DOM-Objekten_jquery

WBOY

Freigeben： 2016-05-16 15:14:40

Original

1174 Leute haben es durchsucht

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;

Nach dem Login kopieren

Obwohl jQuery-Objekte durch 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, wenn sie wahllos verwendet werden. Zum Beispiel: $("#test").innerHTML, document.getElementById("id").html() und andere Schreibmethoden sind falsch.
Beachten Sie 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.
Da jQuery unterschiedlich, aber auch verwandt ist, können jQuery-Objekte und DOM-Objekte auch ineinander konvertiert werden. Bevor wir die beiden konvertieren, treffen wir zunächst eine Konvention: Wenn ein jQuery-Objekt erhalten wird, fügen wir $ vor der Variablen hinzu, wie zum Beispiel: var $variab = jQuery-Objekt, wenn ein DOM-Objekt erhalten wird, ist es dasselbe wie üblich: var variab = DOM-Objekt; diese Konvention dient nur der Vereinfachung der Erklärung und der Unterscheidung und ist in der tatsächlichen Verwendung nicht vorgeschrieben.

Bevor Sie die gegenseitige Konvertierung zwischen JQuery-Objekten und DOM-Objekten besprechen, vereinbaren Sie zunächst den Stil der Variablendefinition. Wenn Sie ein JQuery-Objekt erhalten, fügen Sie $ vor der Variablen hinzu, zum Beispiel

var $variable = jquery object; Wenn das DOM-Objekt erhalten wird, wird es wie folgt definiert:

var variable = DOM-Objekt

1. Konvertieren Sie ein JQuery-Objekt in ein DOM-Objekt:

JQuery-Objekte können keine Methoden in DOM verwenden. Wenn Sie jedoch mit den von JQuery-Objekten bereitgestellten Methoden nicht vertraut sind oder es keine Methoden gibt, die JQuery kapseln möchte, müssen Sie DOM-Objekte verwenden, nämlich [index] und get[ index].

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

Der JQuery-Code lautet wie folgt

<body>
  <p>my</p>
  <p>my</p>
<script src="jquery-2.1.4.min.js"></script>
<script>
  var $cr = $("p");  //jquery对象
  var cr = $cr[1];  //dom对象
  var ct = $cr.get(0)  //第二种转换为DOM对象的方式
  cr.innerHTML = "you"  //检测是否转换成功，可以用DOM方法 输出结果为第二个my改成了you
  ct.innerHTML = 'fuck'  //输出结果第一个my改成了fuck
</script>
</body>

Nach dem Login kopieren

(2).DOM-Objekt in JQuery-Objekt konvertiert:

Für ein DOM-Objekt müssen Sie das DOM-Objekt nur mit $() umschließen, und dann können Sie ein JQuery-Objekt erhalten. Die Methode ist $(DOM-Objekt).

Der JQuery-Code lautet wie folgt:

<body>
  <p>my</p>
  <p>my</p>
<script src="jquery-2.1.4.min.js"></script>
<script>
  var cr = document.getElementsByTagName("p") //DOM对象
  var $cr = $(cr);   //jquery对象
  $cr.eq(0).("fuck"); //检测是否转换成功，可以用jquery方法 输出结果为第二个my改成了fuck
  $cr.eq(1).html("you"); //输出结果为my改成you
</script>
</body>

Nach dem Login kopieren

Nach der Konvertierung können Sie JQuery-Methoden beliebig verwenden.

Mit den oben genannten Methoden können JQuery-Objekte und DOM-Objekte beliebig ineinander konvertiert werden.

Abschließend wird noch einmal betont, dass nur DOM-Objekte DOM-Methoden verwenden können, JQuery-Objekte jedoch keine Methoden in DOM verwenden können, JQuery-Objekte jedoch einen umfassenderen Satz von Tools für den Betrieb von DOM bereitstellen.

Ich hoffe, dass Ihnen allen dieser Artikel gefällt.