核心知识
事件委托
在稳定父容器监听事件,再根据 target 找到实际子项,动态新增项也能被处理。
- 依赖冒泡
- 使用 closest 匹配控件
- 检查匹配项确实属于当前容器
tabs.addEventListener('click', event => {
const tab = event.target.closest('[role="tab"]');
if (!tab || !tabs.contains(tab)) return;
selectTab(tab);
});