js通过判断地址字符串,来添加样式

在一个工程中,header部分一般都是公用的,有些导航也在header里面,点击菜单,跳转页面,点击另外一个,跳转到另外的页面。

//这是header.jsp部分

如html代码:<ul class="nav_menu">                                                                                                                            
                          <li class="articlemsg"><a href="${basePath}/back/article/index.html">文章管理</a></li>
                         <li class="menumsg"><a href="${basePath}/back/menu/index.html">菜单管理</a></li>
                         <li class="usermsg"><a href="${basePath}/back/user/index.html">用户管理</a></li>
                      </ul>

有3个导航栏目,这是header部分,你点击会跳转到相应的页面,但是一般你都要给li  或者a加样式,这就得在js中完成。

代码如下:

<script type="text/javascript">
    $(function(){
        var url = window.location.href ;                                                                                            //获取url地址
        if(url.indexOf("article") >= 0){                                                                                              //判断获取的地址字符串中有没有  article字符串 有就执行添加focus_bg类,a字体颜色改变
            $(".articlemsg").addClass("focus_bg").children("a").css("color","#093153");
        }else if(url.indexOf("menu") >= 0){
            $(".menumsg").addClass("focus_bg").children("a").css("color","#093153");
        }else if(url.indexOf("user") >= 0){
            $(".usermsg").addClass("focus_bg").children("a").css("color","#093153");
        }
    });
</script>

//index.jsp部分

<body >
    <%@ include file="/common/header.jsp"%>                      //调用公共的header.jsp
    <div>1111111111111111111111111111111111111</div>

</div>

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值