首頁 > web前端 > js教程 > 主體

如何在一行程式碼中將事件偵聽器新增至多個元素?

Susan Sarandon
發布: 2024-10-26 08:29:03
原創
826 人瀏覽過

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

在單行中向多個元素添加事件監聽器

使用多個元素時,向每個元素添加事件監聽器可能很乏味單獨一個。值得慶幸的是,有一種方法可以簡化此過程,並在一行程式碼中將事件偵聽器新增至多個元素。

使用循環

一種有效的方法是使用循環遍歷元素數組並向每個元素添加事件偵聽器。例如:

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

elementsArray.forEach(function(elem) {
    elem.addEventListener("input", function() {
        // This function does stuff
    });
});
登入後複製

此程式碼選擇與指定選擇器相符的所有元素,並為「input」事件的每個元素新增一個事件偵聽器。

語法問題

您可能已經注意到第二個範例中的語法問題:

element1 && element2.addEventListener("input", function() {
    // this function does stuff
});
登入後複製

此語法在語法上不正確。正確的寫法是:

(element1 && element2) && element2.addEventListener("input", function() {
    // this function does stuff
});
登入後複製

但是,這種方法仍然效率不高,因為它為每個元素單獨添加了一個事件監聽器。上面概述的循環方法是一種更優化的解決方案。

以上是如何在一行程式碼中將事件偵聽器新增至多個元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!