Rumah >hujung hadapan web >tutorial js >Mengapa Fungsi JavaScript Saya Bercanggah dengan ID Elemen Borang?

Mengapa Fungsi JavaScript Saya Bercanggah dengan ID Elemen Borang?

Barbara Streisand
Barbara Streisandasal
2024-11-26 19:39:15414semak imbas

Why Does My JavaScript Function Conflict with a Form Element's ID?

Nama Fungsi JavaScript Bercanggah dengan ID Elemen

Masalah:
Dalam JavaScript, fungsi boleh mempunyai nama yang sama dengan ID elemen. Walau bagaimanapun, dalam beberapa kes, ini boleh membawa kepada ralat. Pertimbangkan dua coretan kod berikut:

// Works as expected
function border(border) { alert(border); }

const select = document.getElementById('border');
select.addEventListener('change', () => border(select.value));
// Fails with "not a function" error
function border(border) { alert(border); }

const form = document.getElementById('border');
form.addEventListener('change', () => border(form.value));

Mengapakah coretan pertama berfungsi manakala coretan kedua gagal?

Penyelesaian:
Isu ini disebabkan oleh ciri warisan yang diperkenalkan dalam JavaScript versi 1.0 hingga 1.3. Apabila unsur bentuk adalah sebahagian daripada bentuk, ia mewarisi sifat bentuk. Salah satu sifat ini ialah nama elemen, yang juga boleh digunakan untuk merujuk elemen.

Dalam coretan kedua, nama fungsi "sempadan" bercanggah dengan sifat borang dengan nama yang sama. Apabila pendengar acara dicetuskan, JavaScript cuba memanggil sifat "sempadan" borang sebagai fungsi, yang gagal.

Menurut Spesifikasi HTML W3C DOM Tahap 2, elemen boleh diakses dengan nama atau ID mereka menggunakan sintaks pelengkap harta kurungan. Walau bagaimanapun, penyemak imbas lama memperluaskan ciri ini untuk membentuk kawalan, membenarkan mereka diakses dengan nama atau ID mereka menggunakan notasi titik.

Mencegah Konflik:
Untuk mengelakkan isu ini, anda harus memastikan bahawa nama fungsi tidak bercanggah dengan ID elemen atau sifat JavaScript lain. Selain itu, anda boleh menggunakan kaedah yang lebih khusus, seperti document.querySelector(), untuk mencari elemen.

Atas ialah kandungan terperinci Mengapa Fungsi JavaScript Saya Bercanggah dengan ID Elemen Borang?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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