29 lines
1.0 KiB
JavaScript
29 lines
1.0 KiB
JavaScript
// 任务：
|
||
// 1. 获取两个按钮、帮助链接、提示文字和列表
|
||
// 2. 点击 prepend-btn 时创建新 li，并插入到列表最前面
|
||
// 3. 点击 clear-active-btn 时移除所有 item 的 active 类名
|
||
// 4. 点击帮助链接时，用 preventDefault() 阻止跳转
|
||
// 5. 在提示文字里输出“已阻止默认跳转”
|
||
const prependBtn = document.getElementById("prepend-btn")
|
||
const clear = document.getElementById("clear-active-btn")
|
||
const helpLink = document.getElementById("help-link")
|
||
const hintText = document.getElementById("hint-text")
|
||
const messageList = document.getElementById("message-list")
|
||
|
||
prependBtn.addEventListener("click", function () {
|
||
const li = document.createElement("li")
|
||
li.classList.add("item")
|
||
messageList.prepend(li)
|
||
})
|
||
|
||
clear.addEventListener("click", function () {
|
||
const a = document.querySelectorAll("#message-list li")
|
||
a.forEach(item => {
|
||
item.classList.remove("active")
|
||
})
|
||
})
|
||
|
||
helpLink.addEventListener("click", function (event) {
|
||
event.preventDefault()
|
||
hintText.textContent = "已阻止默认跳转"
|
||
}) |