Heim > Artikel > Web-Frontend > Jede Konvertierung zwischen Jquery-Objekten und DOM-Objekten_jquery

Jede Konvertierung zwischen Jquery-Objekten und DOM-Objekten_jquery

WBOYOriginal: 2016-05-16 15:14:401116Durchsuche

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 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>

(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 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.

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Perfekter JQuery-Verarbeitungsmechanismus_jqueryNächster Artikel：Perfekter JQuery-Verarbeitungsmechanismus_jquery

In Verbindung stehende Artikel

Mehr sehen