Rumah hujung hadapan web tutorial js jquery和document获取html元素的区别是什么?

jquery和document获取html元素的区别是什么?

Nov 20, 2020 pm 04:40 PM
document elemen html jquery

区别:jquery获取的html元素是jquery对象,可以执行jquery的方法,而document获取的是dom对象,执行的是dom的方法。jQuery对象是jQuery独有的,不能用DOM方法;而DOM对象也不能用jQuery方法。

jquery和document获取html元素的区别是什么?

相关推荐:《jQuery教程

最近通过ocx做了一个视频插件,然后将插件放到html中(想知道的可以看一下)

因为我要操作这个插件,要播放,停止等,所以我需要获取这个元素,不出意外的,我就用jquery来获取,然后根本无法执行,然后用document来获取,正常执行,具体的如下所示

//正常执行     var obj = document.getElementById("player00");
obj.testhelloworld();//无法执行var playobj = $('#player00');
playobj.testhelloworld();
Salin selepas log masuk

然后我就在想,这两者有什么区别呢?然后搜索了如下结论

jquery获取的html元素是jquery对象,可以执行jquery的方法,而document获取的是dom对象,执行的是dom的方法

说明:

DOM对象是我们用传统的方法(javascript)获得的对象,jQuery对象就是用jQuery的类库选择器获得的对象。JQuery对象就是通过jQuery包装DOM对象后产生的对象。JQuery对象是jQuery独有的,其可以使用jQuery里的方法,但是不能使用DOM的方法

顿时释然,我此前一直认为两个是等价的,并为追究为什么dom的方法为什么不能在jquery来执行,现在想想,完全释然了。

既然这样,那么两者之间怎么互相转化呢?毕竟所得到的对象的内容是一样的。

jQuery对象转成DOM对象: 

两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index); 

(1)jQuery对象是一个数据对象,可以通过[index]的方法,来得到相应的DOM对象。 

如:

var $v =$("#v") ; //jQuery对象 
var v=$v[0]; //DOM对象 
alert(v.checked) //检测这个checkbox是否被选中
Salin selepas log masuk

(2)jQuery本身提供,通过.get(index)方法,得到相应的DOM对象

如:

var $v=$("#v"); //jQuery对象 
var v=$v.get(0); //DOM对象 
alert(v.checked) //检测这个checkbox是否被选中
Salin selepas log masuk

DOM对象转成jQuery对象:

对于已经是一个DOM对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象了。$(DOM对象)

如:

var v=document.getElementById("v"); //DOM对象 
var $v=$(v); //jQuery对象
Salin selepas log masuk

转换后,就可以任意使用jQuery的方法了。 

通过以上方法,可以任意的相互转换jQuery对象和DOM对象。需要再强调注意的是:DOM对象才能使用DOM中的方法,jQuery对象是不可以用DOM中的方法。 

更多编程相关知识,请访问:编程课程!!

Atas ialah kandungan terperinci jquery和document获取html元素的区别是什么?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
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

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

Video Face Swap

Video Face Swap

Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Jalankan fungsi PHP menggunakan onclick Jalankan fungsi PHP menggunakan onclick Feb 29, 2024 pm 04:31 PM

Kami juga akan merangkumi cara lain untuk melaksanakan fungsi PHP melalui acara onclick() menggunakan perpustakaan Jquery. Kaedah ini memanggil fungsi javascript, yang akan mengeluarkan kandungan fungsi php dalam halaman web. Kami juga akan menunjukkan cara lain untuk melaksanakan fungsi PHP menggunakan acara onclick(), memanggil fungsi PHP menggunakan JavaScript tulen. Artikel ini akan memperkenalkan cara untuk melaksanakan fungsi PHP, menggunakan kaedah GET untuk menghantar data dalam URL dan menggunakan fungsi isset() untuk menyemak data GET. Kaedah ini memanggil fungsi PHP jika data ditetapkan dan fungsi tersebut dilaksanakan. Menggunakan jQuery untuk melaksanakan fungsi PHP melalui acara onclick() yang boleh kita gunakan

Cara membaca data excel dalam html Cara membaca data excel dalam html Mar 27, 2024 pm 05:11 PM

Cara membaca data excel dalam html: 1. Gunakan perpustakaan JavaScript untuk membaca data Excel 2. Gunakan bahasa pengaturcaraan bahagian pelayan untuk membaca data Excel;

Petua jQuery: Cepat ubah suai teks semua teg pada halaman Petua jQuery: Cepat ubah suai teks semua teg pada halaman Feb 28, 2024 pm 09:06 PM

Tajuk: Petua jQuery: Cepat ubah suai teks semua teg pada halaman Dalam pembangunan web, kita selalunya perlu mengubah suai dan mengendalikan elemen pada halaman. Apabila menggunakan jQuery, kadangkala anda perlu mengubah suai kandungan teks semua teg dalam halaman sekaligus, yang boleh menjimatkan masa dan tenaga. Berikut akan memperkenalkan cara menggunakan jQuery untuk mengubah suai teks semua teg pada halaman dengan cepat, dan memberikan contoh kod khusus. Pertama, kita perlu memperkenalkan fail perpustakaan jQuery dan memastikan bahawa kod berikut dimasukkan ke dalam halaman: &lt

Apakah pemisah talian dreamweaver? Apakah pemisah talian dreamweaver? Apr 08, 2024 pm 09:54 PM

Gunakan teg <br> dalam Dreamweaver untuk membuat pemisah baris, yang boleh dimasukkan melalui menu, kekunci pintasan atau menaip terus. Boleh digabungkan dengan gaya CSS untuk mencipta baris kosong ketinggian tertentu. Dalam sesetengah kes, adalah lebih sesuai untuk menggunakan teg <p> dan bukannya teg <br> kerana ia secara automatik mencipta baris kosong antara perenggan dan menggunakan kawalan gaya.

Gunakan jQuery untuk mengubah suai kandungan teks semua teg Gunakan jQuery untuk mengubah suai kandungan teks semua teg Feb 28, 2024 pm 05:42 PM

Tajuk: Gunakan jQuery untuk mengubah suai kandungan teks semua teg jQuery ialah perpustakaan JavaScript yang popular yang digunakan secara meluas untuk mengendalikan operasi DOM. Dalam pembangunan web, kita sering menghadapi keperluan untuk mengubah suai kandungan teks tag pautan (tag) pada halaman. Artikel ini akan menerangkan cara menggunakan jQuery untuk mencapai matlamat ini dan memberikan contoh kod khusus. Pertama, kita perlu memperkenalkan perpustakaan jQuery ke dalam halaman. Tambahkan kod berikut dalam fail HTML:

Dokumen GTA 6 memberikan gambaran keseluruhan terperinci tentang semua kebocoran Dokumen GTA 6 memberikan gambaran keseluruhan terperinci tentang semua kebocoran Sep 08, 2024 am 06:37 AM

Pada 3 September, versi 1.5 dokumen Grand Theft Auto VI yang memberikan gambaran keseluruhan terperinci tentang semua yang diketahui tentang permainan setakat ini. Versi dokumen yang dikemas kini telah diumumkan dalam treler yang diterbitkan di X (dahulunya Twitter).??

Bagaimana untuk mengetahui sama ada elemen jQuery mempunyai atribut tertentu? Bagaimana untuk mengetahui sama ada elemen jQuery mempunyai atribut tertentu? Feb 29, 2024 am 09:03 AM

Bagaimana untuk mengetahui sama ada elemen jQuery mempunyai atribut tertentu? Apabila menggunakan jQuery untuk mengendalikan elemen DOM, anda sering menghadapi situasi di mana anda perlu menentukan sama ada sesuatu elemen mempunyai atribut tertentu. Dalam kes ini, kita boleh melaksanakan fungsi ini dengan mudah dengan bantuan kaedah yang disediakan oleh jQuery. Berikut akan memperkenalkan dua kaedah yang biasa digunakan untuk menentukan sama ada elemen jQuery mempunyai atribut khusus, dan melampirkan contoh kod tertentu. Kaedah 1: Gunakan kaedah attr() dan operator jenis // untuk menentukan sama ada elemen mempunyai atribut tertentu

Pengenalan kepada cara menambah baris baharu pada jadual menggunakan jQuery Pengenalan kepada cara menambah baris baharu pada jadual menggunakan jQuery Feb 29, 2024 am 08:12 AM

jQuery ialah perpustakaan JavaScript yang popular digunakan secara meluas dalam pembangunan web. Semasa pembangunan web, selalunya perlu menambah baris baharu secara dinamik pada jadual melalui JavaScript. Artikel ini akan memperkenalkan cara menggunakan jQuery untuk menambah baris baharu pada jadual dan memberikan contoh kod khusus. Pertama, kita perlu memperkenalkan perpustakaan jQuery ke dalam halaman HTML. Pustaka jQuery boleh diperkenalkan dalam teg melalui kod berikut:

See all articles