Was ist die Konvertierungsmethode zwischen JQuery-Objekt und Dom-Objekt?

WBOY
Freigeben: 2022-06-02 15:40:50
Original
7336 Leute haben es durchsucht

Methoden: 1. „obj[index]“- und „obj.get(index)“-Methoden können Jquery-Objekte in DOM-Objekte konvertieren. 2. „ $ (DOM-Objekt)“-Methode, die das Dom-Objekt in ein JQuery-Objekt konvertieren kann.

Was ist die Konvertierungsmethode zwischen JQuery-Objekt und Dom-Objekt?

Die Betriebsumgebung dieses Tutorials: Windows10-System, JQuery3.2.1-Version, Dell G3-Computer.

Konvertierungsmethode zwischen JQuery-Objekt und Dom-Objekt

1. JQuery-Objekt in DOM-Objekt konvertieren

JQuery-Objekt ist ein Array-ähnliches Objekt, das intern DOM-Objekte als Array-Elemente verwendet. Es gibt zwei Möglichkeiten, jQuery-Objekte in DOM-Objekte zu konvertieren, nämlich „obj[index]“ und „obj.get(index)“. Dabei stellt Index den Index des DOM-Objekts im jQuery-Objekt dar. Diese beiden Konvertierungsmethoden werden im Folgenden erläutert.

(1)obj[index]

Konvertieren Sie ein jQuery-Objekt in ein DOM-Objekt mit der obj[index]-Methode. Der Beispielcode lautet wie folgt.

<div>第1个div</div>
<div>第2个div</div>
<script>
//获取jQuery对象
var divs = $(&#39;div&#39;);
//通过索引的方式,将jQuery对象转换成DOM对象
var div1 = divs[0];
var div2 = divs[1];
//输出div元素的内容
alert(div1.innerHTML);    //输出结果:第1个div
alert(div2. innerHTML);    //输出结果:第2个div
</script>
Nach dem Login kopieren

Wie aus dem obigen Code ersichtlich ist, kann ein jQuery-Objekt mehrere DOM-Elemente enthalten und ein bestimmtes DOM-Objekt kann durch Indizierung abgerufen werden.

(2) obj.get(index)

Konvertieren Sie ein jQuery-Objekt in ein DOM-Objekt mit der obj.get(index)-Methode. Der Beispielcode lautet wie folgt.

<div>第1个div元素</div>
<script>
var result = $(&#39;div&#39;).get(0).innerHTML;
alert(result);    //输出结果:第1个div元素
</script>
Nach dem Login kopieren

2. Konvertieren Sie DOM-Objekte in jQuery-Objekte

var name = $(DOM对象)
Nach dem Login kopieren

Verwenden Sie das DOM-Objekt als Parameter der $()-Funktion, um es in ein jQuery-Objekt zu konvertieren.

<button id="btn">say hello</button>
<script>
//获取DOM对象btn
var btn = document.getElementById(&#39;btn&#39;);
//将DOM对象转换成jQuery对象
var btnl = $(btn);
//验证转换结果
alert(btn === btnl[0]);    //输出结果: true
</script>
Nach dem Login kopieren

Wie Sie dem obigen Code entnehmen können, können DOM-Objekte und jQuery-Objekte während der Entwicklung flexibel ineinander konvertiert werden.

Empfehlung für ein Video-Tutorial: jQuery-Video-Tutorial

Das obige ist der detaillierte Inhalt vonWas ist die Konvertierungsmethode zwischen JQuery-Objekt und Dom-Objekt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage