Rumah > Artikel > hujung hadapan web > Sebarang penukaran antara objek jquery dan DOM objects_jquery

Sebarang penukaran antara objek jquery dan DOM objects_jquery

WBOYasal: 2016-05-16 15:14:401116semak imbas

Apakah objek jQuery?
---Ia adalah objek yang dihasilkan dengan membalut objek DOM melalui jQuery. Objek jQuery adalah unik untuk jQuery dan boleh menggunakan kaedah dalam jQuery.
Contohnya:
$("#test").html() bermaksud: dapatkan kod html dalam elemen dengan ujian ID. Antaranya, html() ialah kaedah dalam jQuery
Kod ini bersamaan dengan menggunakan DOM untuk melaksanakan kod:

document.getElementById("id").innerHTML;

Walaupun objek jQuery dijana dengan membungkus objek DOM, jQuery tidak boleh menggunakan sebarang kaedah objek DOM Begitu juga, objek DOM tidak boleh menggunakan kaedah dalam jQuery, ralat akan dilaporkan. Contohnya: $("#test").innerHTML, document.getElementById("id").html() dan kaedah penulisan lain adalah salah.
Perkara lain yang perlu diambil perhatian ialah objek jQuery yang diperoleh dengan menggunakan #id sebagai pemilih dan objek DOM yang diperolehi oleh document.getElementById("id") tidak setara. Sila lihat penukaran antara kedua-duanya di bawah.
Memandangkan jQuery berbeza tetapi juga berkaitan, objek jQuery dan objek DOM juga boleh ditukar antara satu sama lain. Sebelum menukar kedua-duanya, kita mula-mula membuat konvensyen: jika objek jQuery diperoleh, maka kita menambah $ di hadapan pembolehubah, seperti: var $variab = objek jQuery, jika objek DOM diperoleh, ia adalah sama seperti biasa. : var variab = objek DOM; konvensyen ini hanya untuk kemudahan penjelasan dan perbezaan, dan tidak ditetapkan dalam penggunaan sebenar.

Sebelum membincangkan penukaran bersama antara objek jquery dan objek DOM, mula-mula bersetuju dengan gaya menentukan pembolehubah Jika anda memperoleh objek jquery, tambahkan $ di hadapan pembolehubah, contohnya

var $varible = objek jquery; Jika objek DOM diperoleh, ia ditakrifkan seperti berikut:

var variable = objek DOM;

1. Tukar objek jquery kepada objek DOM:

Objek Jquery tidak boleh menggunakan kaedah dalam DOM, tetapi jika anda tidak biasa dengan kaedah yang disediakan oleh objek jquery, atau tiada kaedah yang ingin dirangkumkan oleh jquery, anda perlu menggunakan objek DOM, iaitu [index] dan dapatkan[ indeks].

(1) Objek jquery ialah objek tatasusunan, dan objek DOM yang sepadan boleh diperolehi melalui kaedah [indeks].

Kod jquery adalah seperti berikut

<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).Objek DOM ditukar kepada objek jquery:

Untuk objek DOM, anda hanya perlu membungkus objek DOM dengan $(), dan kemudian anda boleh mendapatkan objek jquery Kaedahnya ialah $(objek DOM).

Kod jquery adalah seperti berikut:

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

Selepas penukaran, anda boleh menggunakan kaedah jquery sewenang-wenangnya.

Melalui kaedah di atas, objek jquery dan objek DOM boleh ditukar antara satu sama lain secara sewenang-wenangnya.

Akhirnya, ditekankan sekali lagi bahawa hanya objek DOM boleh menggunakan kaedah DOM tidak boleh menggunakan kaedah dalam DOM, tetapi objek jquery menyediakan set alat yang lebih lengkap untuk mengendalikan DOM.

Semoga anda semua akan menyukai artikel ini.

Kenyataan：

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel sebelumnya：Mekanisme_jquery pemprosesan jquery yang sempurnaArtikel seterusnya：Mekanisme_jquery pemprosesan jquery yang sempurna

Artikel berkaitan

Lihat lagi