Javascript 如何在特定的单击按钮上添加addEventListener？

我想在单击的订单按钮上使用

addEventListener（）

。最有效的方法是什么？我现在是这样做的：

const executeUpdateSummary=（e）=>{
const classNameOfTargetedEl=event.target.className；
if（classNameOfTargetedEl==（'order-button'））{
更新订单摘要（e）；
}
};
const pizzasElement=document.querySelector（'.pizzas'）；
pizzasElement.addEventListener（'click'，executeUpdateSummary，false）

玛格丽塔
价格:$5
浇头：
番茄
莫泽雷勒干酪
增加订单
为什么不将事件处理程序直接绑定到按钮？这样，您根本不需要检查事件处理程序中的类：


const pizzaButtons=Array.from（document.querySelectorAll（'.pizzas.order button'））；
pizzaButtons.forEach（btn=>btn.addEventListener（'click'，event=>{
log（'更新订单摘要…'）；
console.log（'Clicked button:'，event.target）；
}));

玛格丽塔
价格:$5
浇头：
番茄
莫泽雷勒干酪
增加订单
意大利 辣味 香肠
价格:$7
浇头：
番茄
莫泽雷勒干酪
意大利 辣味 香肠
增加订单
在您的代码中没有
事件的
参数
执行更新摘要
我不明白您的意思。你到底想干什么？如果您想要确切的按钮，请给它一个
id
，并使用
getElementById
而不是按类获取它。您面临的问题是什么？@ConstantinChirila为
executeUpdateSummary
@zero298添加了
event
参数，我可以在不添加id的情况下执行此操作吗？这不是只针对第一个按钮（带有
顺序按钮的元素
类）？类是可重用的，id不是我没有得到它。对于您的代码，若我单击第一个按钮，我将在控制台中看到消息。但若我点击第二个按钮（或除第一个以外的任何按钮），什么也不会发生。