JQ 遍历元素并给相应元素增加class

2023-10-29 23:32| 来源: 网络整理| 查看: 265

应用帝国后台做公共模板时，需要公共导航栏点击后，加载到对应的栏目列表，同时该栏目导航项添加背景class

思路：使用location.href获取到当前页链接，使用split切割获取的链接字符串，使用切割后得到的关键词匹配对应栏目class，遍历该class，同时给该class增加对应样式

重点：1.location.href

2.str.split('syb')

3.$el.each(function(){})

首页应用游戏专题资讯教程热门 $(".item_cell").removeClass('active'); const localUrl= location.href;//获取当前页链接 console.log(localUrl); var clsDatArr =localUrl.split("/");//切割链接组成数组 var clsNam = clsDatArr[3];获取关键字符 console.log(clsNam); $(function(){ $(".item_cell").each(function(){ if($(this).hasClass(clsNam)){ $(this).addClass('active') } }); });

注意：需要在function中增加点击首页时候，获取关键字符为空的情况，应该预先判断是否为空，加在遍历li元素之前。暂未测！

【本文地址】

公司简介

联系我们