var turl = window.location.search;
var turls = turl.substr(1);
if(turls == 1){
$(".news-category").children().removeClass("current");
$(".news-category").children().eq(0).addClass("current");
$(".news1").show();
$(".news2").hide();
$(".news3").hide();
$(".news4").hide();
$(".news5").hide();
$(".news6").hide();
}else if(turls == 2){
$(".news-category").children().removeClass("current");
$(".news-category").children().eq(1).addClass("current");
$(".news2").show();
$(".news1").hide();
$(".news3").hide();
$(".news4").hide();
$(".news5").hide();
$(".news6").hide();
}
else if(turls == 3){
$(".news-category").children().removeClass("current");
$(".news-category").children().eq(2).addClass("current");
$(".news3").show();
$(".news1").hide();
$(".news2").hide();
$(".news4").hide();
$(".news5").hide();
$(".news6").hide();
}
else{
$(".news-category").children().removeClass("current");
$(".news-category").children().eq(3).addClass("current");
$(".news4").show();
$(".news1").hide();
$(".news3").hide();
$(".news2").hide();
$(".news5").hide();
$(".news6").hide();
}
1
dallaslu 2016-06-13 09:28:49 +08:00 1
至少可以提炼出方法啊。
```javascript var turl = window.location.search; var turls = turl.substr(1); (function(index){ $(".news-category").children().removeClass("current"); $(".news1").hide(); $(".news2").hide(); $(".news3").hide(); $(".news4").hide(); $(".news5").hide(); $(".news6").hide(); $(".news-category").children().eq(index-1).addClass("current"); $(".news" + index).show(); })(turls); ``` |
2
ljcarsenal 2016-06-13 10:25:25 +08:00 1
1.可以用 switch
2. 需要缓存 dom 元素。。。。。 3. 如果 news12345 是兄弟元素的话, $(".news2").show().siblidngs('div').hide() 4. 可以利用 数字直接选择 不写 if 。。跟楼上一样 |
3
xqin 2016-06-13 10:35:06 +08:00 2
```javascript
var turls = ~~location.search.substr(1) || 4; $('.news1,.news2,.news3,.news4,.news5,.news6').hide().filter('.news' + turls).show(); $('.news-category').children().removeClass('current').eq(turls - 1).addClass('current'); ``` |
4
exoticknight 2016-06-13 10:42:39 +08:00
看起来就是菜单切换嘛……
楼上都说得差不多了,加一个 给元素加一个 .news 的类就可以全部选择再隐藏,然后特定的 news 再显示 |
5
andy12530 2016-06-13 10:43:00 +08:00
先把你的 html 写清楚,一大堆选择器,有啥优化的。
|
6
fds 2016-06-13 11:01:21 +08:00
写函数, news 用循环和字符串拼接
|
7
newbieo0O 2016-06-13 11:02:34 +08:00
有个东东叫 siblings
|
8
otakustay 2016-06-13 11:02:56 +08:00
给所有的 news 再统一加一个.news 的 class 就好办了
var turl = window.location.search; var index = turl.substr(1) - 1; $(".news-category").children().removeClass("current").eq(index).addClas("current"); $(".news").hide(); $(".news" + index).show(); |
9
pppanda 2016-06-13 11:09:26 +08:00
var turl = window.location.search.substr(1)
$(".news-category").children().removeClass("current").eq(turl - 1).addClass("current") $(".news1,.news2,.news3,.news4,.news5,.news6").hide(); $(".news" + (turl + 1)).show(); |
10
Niphor 2016-06-13 13:00:07 +08:00
var turl = window.location.search.substr(1)
var $cates = $(".news-category").children() var $news = $(".news1,.news2,.news3,.news4,.news5,.news6") $cates.removeClass("current").eq(turl - 1).addClass("current") $news.hide().filter(".news" + (turl + 1)).show(); 把楼上的稍微改了一下 同 7 楼 可以的话 siblings 也挺好用的啊 |
11
Niphor 2016-06-13 13:04:11 +08:00
哦 还少了句 turl = Math.min(turl|0,3)
|
12
kisnows 2016-06-13 13:27:54 +08:00
缓存 DOM 节点
添加统一隐藏方法,而不是每个都去 hide |
13
FrankFang128 2016-06-13 13:33:06 +08:00
似不似撒?
|
14
bologer OP 谢谢大神们 学到了很多 前端路途任重道远 幸好有你万分感谢!
|
15
bdbai 2016-06-13 16:05:08 +08:00 via Android 1
上 MVVM 框架吧,大项目用 jQuery 难受得很。
|
16
sdwill 2016-06-13 16:37:21 +08:00 1
给个统一的 class ,如:.news ,然后控制 css 就可以啦:
.news {display:none;} //默认隐藏 .news.current {display:block;} |