Bagaimanakah Perlanggaran Nama Fungsi JavaScript dengan ID Elemen Boleh Dielakkan?

Perlanggaran Nama Fungsi dengan ID Elemen dalam JavaScript

Pembangun web sering menghadapi isu pelik apabila nama fungsi JavaScript bercanggah dengan ID elemen, membawa kepada ralat seperti "bukan fungsi." Isu ini berpunca daripada ciri legasi JavaScript yang berasal dari zaman awal pembangunan web.

Isu Rantaian Skop Warisan

Dalam JavaScript 1.0 hingga 1.3, tiada perbezaan yang jelas antara bahasa pengaturcaraan dan API DOM. Akibatnya, kawalan borang mempunyai akses kepada sifat objek borang, termasuk nama kawalan. Ini bermakna jika elemen pilihan mempunyai ID "sempadan", kod berikut akan berfungsi:

function border(border) { alert(border); }
<select>

Walau bagaimanapun, kesederhanaan ini disertakan dengan kaveat. Jika kawalan borang diletakkan dalam borang, objek borang menjadi ketiga seterusnya dalam rantai skop. Akibatnya, kod berikut akan gagal:

<form>
  <select>

Dalam kes ini, sifat "sempadan" bagi objek bentuk membayangi fungsi "sempadan" global, menyebabkan ralat "bukan fungsi".

Keserasian HTML W3C DOM Tahap 2

Untuk menangani isu ini, Tahap DOM W3C 2 HTML memperkenalkan kebolehan untuk mengakses elemen dengan nama atau ID mereka melalui sintaks pengakses sifat kurungan. Ini bermakna kod berikut kini bersamaan dengan kod bermasalah di atas:

document.forms["myForm"].elements["border"](this.value)

Cadangan

Untuk mengelakkan isu perlanggaran ini, adalah dinasihatkan untuk mengelak daripada menggunakan nama atau ID yang sama untuk kawalan borang seperti untuk fungsi yang ditentukan pengguna. Selain itu, pembangun harus mengelak daripada menggunakan pengecam yang sama untuk fungsi dan salah satu hujahnya, kerana ia menyebabkan objek fungsi tidak boleh diakses dari dalam fungsi.

Atas ialah kandungan terperinci Bagaimanakah Perlanggaran Nama Fungsi JavaScript dengan ID Elemen Boleh Dielakkan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!