Rumah > hujung hadapan web > tutorial js > Bagaimanakah saya boleh menambah pendengar acara kepada berbilang elemen dalam satu baris kod?

Bagaimanakah saya boleh menambah pendengar acara kepada berbilang elemen dalam satu baris kod?

Susan Sarandon
Lepaskan: 2024-10-26 08:29:03
asal
911 orang telah melayarinya

How can I add event listeners to multiple elements in a single line of code?

Menambah Pendengar Acara kepada Berbilang Elemen dalam Baris Tunggal

Apabila bekerja dengan berbilang elemen, ia boleh membosankan untuk menambah pendengar acara pada setiap seorang secara individu. Syukurlah, terdapat cara untuk menyelaraskan proses ini dan menambah pendengar acara kepada berbilang elemen dalam satu baris kod.

Menggunakan Gelung

Satu kaedah yang berkesan ialah dengan gunakan gelung untuk melelaran melalui tatasusunan elemen dan tambahkan pendengar acara pada setiap satu. Contohnya:

let elementsArray = document.querySelectorAll("whatever");

elementsArray.forEach(function(elem) {
    elem.addEventListener("input", function() {
        // This function does stuff
    });
});
Salin selepas log masuk

Kod ini memilih semua elemen yang sepadan dengan pemilih yang ditentukan dan menambahkan pendengar acara kepada setiap satu untuk acara "input".

Kebimbangan Tatabahasa

Anda mungkin perasan isu tatabahasa dalam contoh kedua anda:

element1 && element2.addEventListener("input", function() {
    // this function does stuff
});
Salin selepas log masuk

Sintaks ini tidak betul dari segi tatabahasa. Cara yang betul untuk menulis ini ialah:

(element1 && element2) && element2.addEventListener("input", function() {
    // this function does stuff
});
Salin selepas log masuk

Walau bagaimanapun, kaedah ini masih tidak cekap kerana ia menambahkan pendengar acara kepada setiap elemen secara berasingan. Pendekatan gelung yang digariskan di atas ialah penyelesaian yang lebih dioptimumkan.

Atas ialah kandungan terperinci Bagaimanakah saya boleh menambah pendengar acara kepada berbilang elemen dalam satu baris kod?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
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
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan