30 lines
765 B
JavaScript
30 lines
765 B
JavaScript
// 任务：
|
|
// 1. 给 panel 绑定点击事件，输出一条日志
|
|
// 2. 给 lesson-list 绑定点击事件，使用事件委托
|
|
// 3. 点击 li 时切换 active 类名
|
|
// 4. 点击删除按钮时，阻止冒泡并删除当前 li
|
|
const panel = document.getElementById("panel")
|
|
panel.addEventListener("click", function () {
|
|
console.log("点击外部")
|
|
})
|
|
|
|
const list = document.getElementById("lesson-list")
|
|
list.addEventListener("click", function (event) {
|
|
|
|
const remove = event.target.closest(".remove-btn")
|
|
if (remove) {
|
|
const li = remove.closest(".lesson-item")
|
|
|
|
if (li) {
|
|
li.remove()
|
|
event.stopPropagation()
|
|
}
|
|
return
|
|
}
|
|
|
|
const tog = event.target.closest(".lesson-item")
|
|
if (tog) {
|
|
tog.classList.add("active")
|
|
}
|
|
|
|
}) |