SQL Server Tips, Teknik, dan Artikel

Cara Memperbaiki Pemilih jQuery Mengembalikan n.fn.init[0]

carbon-22.png

[ad_1]

jQuery adalah pustaka JavaScript populer yang dirilis jauh sebelum era kerangka kerja JavaScript seperti React atau Vue. Sebenarnya, itu keluar pada tahun 2006 yang merupakan 7 tahun sebelum React keluar pada tahun 2013. Terlepas dari usianya dan fakta bahwa banyak proyek baru menggunakan teknologi yang lebih baru, sebagian besar web masih menyertakan jQuery karena seberapa luasnya dulu. Karena itu, bahkan jika Anda memilih kerangka kerja terbaru dan terbaik untuk aplikasi web baru Anda, Anda mungkin akan menemukan jQuery jika Anda harus mempertahankan proyek yang lebih lama. Dengan mengingat hal ini, mari kita lihat masalah jQuery yang mungkin Anda temui dan cara mengatasinya. Masalah khusus ini melibatkan melihat sesuatu seperti n.fn.init[0] ketika Anda menggunakan pemilih jQuery ketika Anda berharap untuk melihat elemen yang dipilih itu sendiri.

Masalah

Sebenarnya ada beberapa alasan Anda mungkin melihat ini secara tidak terduga. Alasan tersebut bermuara pada dokumen yang tidak dimuat sepenuhnya sebelum mencoba memilih elemen atau tidak memilih elemen dengan benar secara umum.

Jika kamu melihat n.fn.init[0] atau sesuatu yang serupa saat Anda menggunakan console.log(), yang sebenarnya Anda lihat adalah fungsi jQuery itu sendiri. Jika kamu melihat [0] itu berarti elemen yang Anda coba pilih tidak ada (belum) di DOM. Jika Anda melihat indeks yang berbeda maka elemen melakukan ada tetapi Anda masih mencatat fungsi jQuery daripada elemen itu sendiri. Untungnya, ada beberapa cara untuk menyelesaikan masalah ini dengan cepat.

Solusinya

Pertama dan terpenting, sebagai pemeriksaan kewarasan, sangat berguna untuk memeriksa ulang pemilih Anda untuk memastikan mereka melakukan apa yang Anda inginkan. Pastikan tidak ada kesalahan ketik atau semacamnya sehingga Anda dapat mempersempit masalah. Dengan itu, Anda ingin membungkus seluruh kode jQuery Anda di dalam perpustakaan yang disediakan ready fungsi. Fungsi ini akan memastikan bahwa DOM benar-benar siap untuk dimanipulasi sebelum salah satu kode Anda mencoba melakukannya. Inilah yang terlihat seperti:

<script> $(document).ready(function () { console.log('Hello world!'); }); </script>

Code language: HTML, XML (xml)

Melakukan hal ini dapat menyelesaikan masalah Anda atau setidaknya sebagian karena kode pasti hanya akan berjalan saat Anda menginginkannya, dan bukan sebelumnya. Langkah selanjutnya adalah menggunakan .get() pada pemilih Anda untuk benar-benar mendapatkan elemen yang Anda pilih dari fungsi yang dikembalikan oleh pemilih. Mari kita buat sebuah contoh. HTML yang kami gunakan di sini sederhana:

<!DOCTYPE html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> </head> <html> <div> <h1 id="intro">hello world!</h1> </div> </html>

Code language: HTML, XML (xml)

Berikut JavaScriptnya:

<script> $(document).ready(function () { const intro = $('#intro'); console.log(intro); }); </script>

Code language: HTML, XML (xml)

Yang perlu kita lakukan di sini adalah mengganti pemilih itu dengan yang berikut:

const intro = $("#intro").get();

Code language: JavaScript (javascript)

Ini sekarang akan mencetak elemen HTML itu sendiri daripada fungsi jQuery.

Kesimpulan

Di sana Anda memilikinya. Semoga ini bisa membantu dan jika berhasil, silakan tinggalkan umpan balik. Jika tidak, beri tahu kami jika Anda dapat menggunakan beberapa informasi lebih lanjut tentang jQuery atau topik lainnya. Terima kasih sudah membaca!

[ad_2]

Source link

Artikel terbaru