html jquery点击之后跳转,jquery实现点击a标签跳转到新页面后,给被点击的那个a标签添加样式...

需求

如图所示，我希望点击“饮料酒水”跳转页面后，“饮料酒水”旁边会出现一个黄色的span,而其他没有被点击的项目没有这个黄色的span。

“饮料酒水”是一个a标签，a标签的href就是图中的url,而我标红的那串数字就是"饮料酒水"的id。我给相应的span也加上了统一的id——也是这串数字。这样，如果我们获取url里的这串id数字，就能用这个id找到我需要显示的span，也就能实现我的需求了。

HTML

CSS

/*下面是span的样式，默认span是不显示的*/

.yellowside{

background-color:#ffd600;

width:0.1rem;

height:90%;

position: absolute;

left:0;

top:0.05rem;

display:none;

}

JS

$(document).ready(function(){

//先获取当前页面的路由里面的路径，也就是/supermarket/104749/0/这部分

var str=window.location.pathname

//分割字符串，变成一个数组

var strlist=new Array()

strlist=str.split('/')

//获取列表里的第2个元素，也就是那串id,比如104749，这串数字正好就是需要显示的span的id

var categoryid=strlist[2]

//用id获取span

var yellowspan=$('#'+categoryid)

//修改span的css样式

yellowspan.css('display','block')

})

注意：我这个例子的特殊性在于，url里面有两串数字，只有第一串数字能决定哪个a标签前面有黄色的span，第二串数字变了只是商品被二次筛选，所以我这里比较麻烦。如果a标签的样式和整个url是一一对应的关系，就不需要像我这样分割url，直接整体对比就行了。

如果这篇博文帮到了你，就请给我点个赞吧(#^.^#)

有疑问也欢迎留言~博主可nice啦，在线秒回ヾ(◍°∇°◍)ﾉﾞ