Bagaimana untuk menggunakan jquery dalam projek

Dengan pembangunan berterusan teknologi web, JavaScript telah menjadi kemahiran yang diperlukan dalam pembangunan web. Sebagai salah satu perpustakaan JavaScript yang paling popular, jQuery juga telah menarik banyak perhatian dalam banyak projek. Artikel ini akan memperkenalkan cara menggunakan jQuery dalam projek anda.

1. Memperkenalkan perpustakaan jQuery

Untuk menggunakan jQuery, anda mesti memperkenalkan perpustakaan jQuery terlebih dahulu ke dalam halaman. Anda boleh memuat turun sendiri fail perpustakaan jQuery dan mengimportnya, atau anda boleh menggunakan CDN (Rangkaian Penghantaran Kandungan) untuk mengimportnya.

Kod untuk menggunakan CDN untuk memperkenalkan perpustakaan teras jQuery adalah seperti berikut:

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

2 Gunakan pemilih jQuery untuk mendapatkan elemen

pemilih jQuery boleh mendapatkan elemen dengan mudah. halaman tersebut. Pemilih biasa ialah:

1. Pemilih elemen

   $('p')  // 获取页面中所有 <p> 元素

   Salin selepas log masuk

2. pemilih id

   $('#myId')  // 获取 ID 为 myId 的元素

   Salin selepas log masuk

3. pemilih kelas

   $('.myClass')  // 获取 class 为 myClass 的元素

   Salin selepas log masuk

4. pemilih atribut

   $('[href]')  // 获取所有包含 href 属性的元素

   Salin selepas log masuk

5. pemilih turunan

   $('ul li')  // 获取所有 <ul> 下的 <li> 元素

   Salin selepas log masuk

3 >

1. Ubah suai atribut elemen

   $('img').attr('src', 'newSrc.jpg')  // 修改所有 <img> 元素的 src 属性

   Salin selepas log masuk

2. Ubah suai kandungan elemen

   $('div').text('newText')  // 将所有 <div> 元素的文本内容改为 newText

   Salin selepas log masuk

3. Tunjukkan/sembunyikan elemen

   $('p').show()  // 显示所有 <p> 元素
   $('p').hide()  // 隐藏所有 <p> 元素

   Salin selepas log masuk

4. Tambah/buang elemen

   $('ul').append('<li>New item</li>')  // 在所有 <ul> 元素的末尾添加一个 <li> 元素
   $('ul li:last-child').remove()  // 删除所有 <ul> 元素中最后一个 <li> 元素

   Salin selepas log masuk

5. Ikat acara

   $('button').click(function () {
     alert('Button clicked!')
   })  // 给所有 <button> 元素绑定 click 事件

   Salin selepas log masuk

$.ajax({
  url: '/getdata',
  type: 'GET',
  dataType: 'json',
  success: function (data) {
    console.log(data)
  },
  error: function (xhr, status, error) {
    console.log(error)
  }
})

Atas ialah kandungan terperinci Bagaimana untuk menggunakan jquery dalam projek. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!