Penjelasan terperinci tentang penggunaan dalam jquery

jQuery ialah salah satu perpustakaan JavaScript yang paling banyak digunakan dan kini telah menjadi salah satu kemahiran penting untuk pembangunan bahagian hadapan. Artikel ini akan memperkenalkan penggunaan perpustakaan jQuery secara terperinci, bertujuan untuk membantu pembaca memahami dengan lebih baik konsep asas, sintaks dan kaedah biasa jQuery.

1. Pengenalan kepada jQuery

jQuery ialah perpustakaan JavaScript yang pantas dan ringkas yang merangkumi ciri teras JavaScript. Ia menyediakan API yang mudah digunakan yang memudahkan traversal dokumen HTML, pengendalian acara, kesan animasi, interaksi AJAX dan operasi lain, membolehkan pembangun menulis aplikasi Web dengan lebih cekap.

Mari lihat cara menggunakan jQuery dalam aplikasi web.

2. Memperkenalkan jQuery

Untuk menggunakan jQuery, kita perlu memperkenalkannya ke dalam aplikasi web. Terdapat dua cara untuk memperkenalkan jQuery:

1. Muat turun fail jQuery (disyorkan)

Kami boleh memuat turun fail jQuery di tapak web rasmi jQuery, dan kemudian memperkenalkannya dalam halaman HTML seperti berikut :

<script src="jquery.js"></script>

Perkenalkan kod di atas sebelum tag 9c3bca370b5104690d9ef395f2c5f8d1 untuk memperkenalkan perpustakaan jQuery ke dalam halaman web. Ambil perhatian bahawa nama fail boleh berbeza-beza bergantung pada versi yang anda muat turun.

2. Memperkenalkan jQuery melalui CDN

Cara lain untuk memperkenalkan jQuery adalah dengan menggunakan CDN (Rangkaian Penghantaran Kandungan Anda hanya perlu memperkenalkannya dalam halaman HTML seperti berikut :

<script src="https://cdn.jsdelivr.net/jquery/3.5.0/jquery.min.js"></script>

Ini akan membawa masuk versi terkini fail jQuery daripada CDN tanpa perlu memuat turun dan menyelenggara fail itu sendiri.

3. Sintaks jQuery

Semua fungsi dalam perpustakaan jQuery dilaksanakan melalui fungsi jQuery(). Fungsi ini juga dipanggil fungsi $, dan pemilih boleh dihantar kepadanya untuk mendapatkan objek jQuery bagi elemen yang ditentukan, seperti ini:

$(selector).action()

• $ Definisi simbol jQuery
• selector ialah elemen HTML yang akan dikendalikan
• action() ialah tindakan yang akan dilakukan, seperti addClass(), fadeOut(), animate(), dll.

4. Pemilih jQuery

Pemilih jQuery membenarkan kami memilih elemen DOM berdasarkan nama tag, kelas, atribut dan nilai atributnya. Tidak seperti pemilih DOM JavaScript tradisional, pemilih jQuery tidak peka huruf besar-kecil.

Berikut ialah beberapa pemilih jQuery biasa:

选择器	描述
*	选择所有元素
#id	选择具有指定id的元素
.class	选择具有指定class的元素
element	选择所有指定元素类型的元素
element.class	选择指定元素class属性中包含指定值的元素
element,element	选择所有指定元素类型的所有指定元素类型的元素
:first	选择文档中第一个指定的元素
:last	选择文档中最后一个指定的元素
:even	选择文档中所有偶数位置的指定元素
:odd	选择文档中所有奇数位置的指定元素
:eq(index)	选择指定位置的指定元素（从第0个开始）
:gt(no)	选择指定位置之后的指定元素
:lt(no)	选择指定位置之前的指定元素
:header	选择所有标题元素（h1 ~ h6）
:not(selector)	选择不符合指定选择器的元素
:contains(text)	选择包含指定文本的元素
:empty	选择不包含子元素和文本的元素
:hidden	选择所有隐藏的元素
:visible	选择所有可见的元素

5. Acara jQuery

Acara jQuery ialah cara paling mudah untuk kami mengendalikan elemen HTML. Berikut ialah beberapa peristiwa jQuery biasa:

事件	描述
click()	鼠标点击事件
dblclick()	鼠标双击事件
mouseenter()	鼠标移入事件
mouseleave()	鼠标移出事件
mousedown()	按下鼠标按钮事件
mouseup()	松开鼠标按钮事件
keydown()	按下键盘按钮事件
keyup()	松开键盘按钮事件
focus()	元素获取焦点事件
blur()	元素失去焦点事件
submit()	提交表单事件
load()	加载页面事件
resize()	调整页面大小事件
scroll()	页面滚动事件
change()	元素内容改变事件

6. Kesan jQuery

jQuery menyediakan satu set kaedah kesan yang berkuasa yang membolehkan kami menambah kesan animasi dengan mudah, menukar kandungan elemen, kedudukan Elemen , saiz elemen, dsb. Berikut ialah beberapa kesan jQuery biasa:

效果	描述
hide()	隐藏指定的元素
show()	显示指定的元素
toggle()	隐藏显示元素的状态
fadeIn()	淡入指定的元素，基于透明度
fadeOut()	淡出指定的元素，基于透明度
fadeToggle()	隐藏显示元素的状态，基于透明度
slideDown()	向下滑动显示指定的元素
slideUp()	向上滑动隐藏指定的元素
slideToggle()	展开或收缩元素
animate()	创建自定义动画
stop()	停止动画
scrollTop()	将滚动条向上移动到指定元素的顶部
scrollLeft()	将滚动条向左移动到指定元素的左侧
css(property)	获取指定CSS属性的值
css(property, value)	设置CSS属性的值
width()	获取元素的宽度
height()	获取元素的高度

7. jQuery AJAX

AJAX ialah teknologi JavaScript dan XML tak segerak yang membolehkan kami menggunakan data permintaan dan tindak balas HTTP melalui JavaScript tanpa perlu Separa halaman boleh dikemas kini dengan memuat semula keseluruhan halaman.

jQuery menyediakan set kaedah AJAX yang berkuasa yang membolehkan kami menggunakan teknologi AJAX dengan mudah. Berikut ialah beberapa kaedah AJAX jQuery yang biasa:

AJAX方法	描述
$.ajax()	使用HTTP请求从远程服务器获取数据
$.get()	使用HTTP GET请求从远程服务器获取数据
$.post()	使用HTTP POST请求从远程服务器获取数据
$.getJSON()	获取JSON格式的数据
$.ajaxSetup()	设置全局AJAX设置
$.ajaxError()	处理AJAX错误
$.ajaxComplete()	处理AJAX请求的完成事件
$.ajaxStart()	处理AJAX开始时的事件
$.ajaxSend()	处理AJAX请求发送前的事件
$.ajaxSuccess()	处理AJAX请求成功的事件
$.ajaxStop()	处理AJAX结束时的事件
$.ajaxSetup()	设置全局AJAX设置

8. Ringkasan

Artikel ini memperkenalkan penggunaan perpustakaan jQuery secara terperinci, termasuk konsep asas, sintaks dan kaedah biasa. Dengan pengetahuan ini di tangan, pembangun boleh menulis aplikasi web dengan lebih cekap. jQuery kini merupakan salah satu perpustakaan JavaScript yang paling popular dan ringkas Ia menyediakan banyak API yang berkuasa untuk JavaScript, menjadikan pembangunan JavaScript lebih mudah untuk difahami, diurus dan dilanjutkan. Dengan menggunakan perpustakaan jQuery, pembangun boleh menyelesaikan tugas yang kompleks dengan mudah, mengendalikan pelbagai acara DOM, melaksanakan pelbagai kesan dan operasi AJAX, yang membantu meningkatkan pengalaman pengguna, kebolehpercayaan dan kelajuan tindak balas aplikasi web.

Atas ialah kandungan terperinci Penjelasan terperinci tentang penggunaan dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!