排他思想

今天打算自己练习一个项目，然后用到了排他思想。就写来省的忘了

由于用js的话需要写的代码有点多，我就用了jQuery。
首先是html：
<ul class="topNav_ul">
   <li class="clickAfter">
    基本信息
   </li>
   <li>
    兴趣爱好
   </li>
   <li>
    工作经历
   </li>
   <li>
    想联系我
   </li>
  </ul>

clickAfter中我定义了选中的样式

代码如下：
.clickAfter{
	 background-color: #999999;
         padding: 0 35px; 
}

jQuery代码如下

$(function(){
	$(".topNav_ul li").click(function(){
	 $(this).addClass("clickAfter");
	 $(this).siblings().removeClass("clickAfter");
     })
})

获取元素，然后调用事件，这里我需要点击所以用的是click事件，然后直接用this，指向自己，addClass添加类，“clickAfter”，就是点击之后的样式类。接下来就是删除其他没有点击的类。排他思想，顾名思义就是排除他人只留下自己。

所以我们为被点中的元素添加被选中的样式。这里用addClass。
然后我们不想让其他的元素被点亮，所以我们需要为这个元素的兄弟元素删除掉这个样式，所以用removeClass。