Bagaimana jquery memuatkan skrip

jQuery ialah perpustakaan JavaScript yang digunakan secara meluas yang menyediakan sintaks ringkas dan kefungsian yang kaya, membolehkan pembangun membina aplikasi web interaktif dengan lebih pantas dan lebih mudah. Apabila menggunakan jQuery untuk menulis aplikasi web, kami mungkin perlu memuatkan atau memanipulasi skrip JavaScript lain pada halaman Artikel ini akan memperkenalkan cara menggunakan jQuery untuk memuatkan skrip.

1. jQuery.load()

jQuery.load() ialah kaedah mudah dan pantas yang boleh memuatkan serpihan HTML URL yang ditentukan ke dalam elemen yang ditentukan pada halaman. Selain memuatkan elemen HTML, kaedah load() juga boleh digunakan untuk memuatkan kandungan lain, seperti skrip JavaScript, fail CSS, dsb.

Apabila anda perlu memuatkan fail JavaScript, anda hanya perlu menghantar URL fail ke dalam kaedah load():

$("head").load("https://example.com/myscript.js");

Di sini kami memuatkan skrip ke dalam teg kepala halaman, yang merupakan amalan yang baik bahawa semasa proses pemaparan halaman web, penyemak imbas akan memuatkan semua kandungan dalam teg kepala terlebih dahulu, supaya kami boleh memuatkan semua skrip yang diperlukan dalam kepala.

2. $.getScript()

$.getScript() ialah kaedah yang disediakan oleh jQuery untuk memuatkan skrip JavaScript Penggunaannya tidak jauh berbeza daripada kaedah load() :

$.getScript("https://example.com/myscript.js", function() {
  // Script has loaded, do something here
});

Apabila kita perlu melakukan beberapa operasi selepas skrip dimuatkan, $.getScript() menyediakan fungsi panggil balik yang boleh melakukan operasi panggil balik selepas skrip dimuatkan. Perlu diingat bahawa kaedah $.getScript() hanya boleh memuatkan skrip JavaScript dan tidak boleh memuatkan jenis kandungan lain.

3. $.ajax()

$.ajax() ialah salah satu kaedah jQuery yang paling berkuasa Ia boleh melaksanakan pelbagai jenis permintaan HTTP tak segerak, termasuk memuatkan skrip dan fail HTML. data JSON, dsb.

Apabila memuatkan fail JavaScript, anda boleh menggunakannya seperti ini:

$.ajax({
  url: "https://example.com/myscript.js",
  dataType: "script",
  success: function() {
    // Script has loaded, do something here
  }
});

Kaedah $.ajax() mempunyai parameter dataType, yang mewakili jenis data yang ingin kami minta tetapkannya kepada "skrip" bermakna apa yang kami ingin minta ialah skrip JavaScript. Sama seperti kaedah $.getScript(), kaedah $.ajax() juga menyediakan fungsi panggil balik untuk melaksanakan operasi panggil balik selepas skrip dimuatkan.

Perlu diambil perhatian bahawa kerana kaedah $.ajax() agak rumit, penggunaan yang tidak betul akan membawa kepada kod kembung dan kesukaran untuk mengekalkannya, dalam pembangunan sebenar, pilihan perlu berdasarkan yang khusus keadaan.

Ringkasan

Apabila membangunkan aplikasi web, kami selalunya perlu memuatkan fail JavaScript lain, termasuk rangka kerja, pemalam, perpustakaan komponen, dsb. jQuery menyediakan pelbagai kaedah untuk memuatkan skrip, masing-masing mempunyai kebaikan dan keburukan tersendiri. Apabila menggunakannya, anda perlu memilih penyelesaian yang sesuai mengikut situasi tertentu untuk mengelakkan kod kembung dan kesukaran untuk mengekalkan.

Selain kaedah yang diperkenalkan di atas, terdapat kaedah lain untuk memuatkan skrip, seperti mencipta teg skrip secara dinamik, pernyataan import ES6, dsb. Dalam aplikasi praktikal, adalah perlu untuk memilih penyelesaian yang paling sesuai mengikut situasi tertentu.

Atas ialah kandungan terperinci Bagaimana jquery memuatkan skrip. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!