الفرق الأهم: addEventListener يمكنه ربط أكثر من دالة بالحدث نفسه، أما onclick فيقبل دالة واحدة فقط، وكل دالة جديدة تستبدل السابقة.
button.onclick = () => console.log('A');
button.onclick = () => console.log('B');
// click → only "B"
button.addEventListener('click', () => console.log('A'));
button.addEventListener('click', () => console.log('B'));
// click → "A" then "B"مزايا أخرى لـ addEventListener
- خيارات مثل
onceوpassive. - إزالة مستمع محدد بـ
removeEventListener.
onclick ليس أسرع بشكل ملحوظ، ولا علاقة له بـ CSS. لذلك addEventListener هي الطريقة المفضلة اليوم.