web蓝桥杯真题:折叠手风琴

代码及注释:

javascript 复制代码
const options = document.querySelectorAll('.option')
options.forEach((item1, index, arr) => {    //循环每个元素都绑定点击事件
    item1.addEventListener('click', () => { 
        arr.forEach(item2 => {      //先把所有元素的active类名删掉
            item2.classList.remove('active')
        })
        item1.classList.add('active')    //给点击元素添加active类名
    })
})

知识点:

1.排他思想口诀:先干到所有人,再复活自己

2.添加元素:element.classList.add('类名')

3.删除元素:element.classList.remove('类名')

4.数组循环array.forEach((item, index, arr) => { })

相关推荐
不可能片场6 分钟前
AI视频成片 帧间差分把拼接缝照出来
前端·electron
写的都是BUG6 分钟前
APK 里的钥匙,一直就放在门口:聊聊加固真正该做什么
前端·算法
dpharness8 分钟前
我踩过的四个记忆坑,从预算到换机
前端·后端
apollo_qwe12 分钟前
接口超时了,前端为什么不能直接重试?
javascript·http
用户77833661321116 分钟前
SerpBase驱动:用原生JS实现搜索意图分流浮层
前端
阿明的小蝴蝶16 分钟前
设备出厂横竖屏修改 & 默认手势导航修改(按键导航)
前端
SameX19 分钟前
ArkTS 做应用内"快捷胶囊" —— 续航日记踩过的两个鸿蒙声明式 UI workaround
前端
用户114818678948420 分钟前
水印的实现方式逻辑
前端·python
孟陬2 小时前
Foobar 技术周刊#160:大模型让大规模形式化软件验证成为现实丨AI写C++代码之后会发生什么?丨我们真的需要alpha() 函数吗丨重试,有时会让故障更
前端·后端·typescript
flash俊杰3 小时前
屏幕感知双通道:截图之外,为什么还要一份 UIA 控件清单
前端