[js] - 为子节点增加鼠标移入和移出的样式

复制代码
var cards = document.querySelectorAll(".card");
for (let index = 0; index < cards.length; index++) {
    const card = cards[index];
    card.addEventListener("mouseover",function(){
        var chils = this.childNodes
        for (let i = 0; i < chils.length; i++) {
            let e = chils[i];
            if(e.nodeType==1 && e.classList.contains('card-info')){
                e.classList.remove("fontDown");
                e.classList.add("fontUp");

            }
        }
    },false)
    card.addEventListener("mouseout",function(){
        var chils = this.childNodes
        for (let i = 0; i < chils.length; i++) {
            let e = chils[i];
            if(e.nodeType==1 && e.classList.contains('card-info')){
                e.classList.remove("fontUp");
                e.classList.add("fontDown");
            }
        }
           
    },false)
}
复制代码

 

posted @   武卡卡  阅读(194)  评论(0编辑  收藏  举报
编辑推荐:
· Linux glibc自带哈希表的用例及性能测试
· 深入理解 Mybatis 分库分表执行原理
· 如何打造一个高并发系统?
· .NET Core GC压缩(compact_phase)底层原理浅谈
· 现代计算机视觉入门之:什么是图片特征编码
阅读排行:
· 手把手教你在本地部署DeepSeek R1,搭建web-ui ,建议收藏!
· Spring AI + Ollama 实现 deepseek-r1 的API服务和调用
· 数据库服务器 SQL Server 版本升级公告
· 程序员常用高效实用工具推荐,办公效率提升利器!
· C#/.NET/.NET Core技术前沿周刊 | 第 23 期(2025年1.20-1.26)

喜欢请打赏

扫描二维码打赏

支付宝打赏

点击右上角即可分享
微信分享提示