javaScript

<div class="container">
        <div class="btn-group">
       <!-- 动态加载首页菜单 -->
<c:forEach items="${sessionScope['selectMainMenuOneSY']}" var="selectMainMenuOnesy">
<c:if test="${selectMainMenuOnesy.menuName =='高校就业监测' }">
           <input id="btn3" type="button" class="btn" value="高校就业监测">
</c:if>
<c:if test="${selectMainMenuOnesy.menuName =='党务管理' }">
           <input id="btn4" type="button" class="btn " value="党务管理">
</c:if>
<c:if test="${selectMainMenuOnesy.menuName =='就业形势监测' }">
           <input id="btn5" type="button" class="btn " value="就业形势监测">
</c:if>
<c:if test="${selectMainMenuOnesy.menuName =='薪酬状况分析' }">
           <input id="btn6" type="button" class="btn" value="薪酬状况分析">
</c:if>
</c:forEach>
        </div>
        <div class="pages">
            <div class="page3  btn3" >
                <div class="basic">
                    <div class="letba">
                        <ul class="underemployment">
                            <li class="stays" id="emply_bsc">未就业</li>
                            <li class="hover" id="emply_bsck">困难未就业</li>
                            <li class="hover" id="emply_bscj">建档立卡</li>
                        </ul>
                        </div>
                    </div>
                </div>


            <div class="page4 btn4">
                <div class="toop">
                    <div class="partyMember">                     
                            <dd>
                                <p>党员总数量：<i id="ptymbTotAmt"></i></p>
                                <p>预备党员数量：<i id="gtstPtymbVol"></i></p>
                                <p>失联党员数量：<i id="ofctPtymbVol"></i></p>
                                <p>组织关系转入：<i id="orgRltnInVol"></i></p>
                                <p>组织关系转出：<i id="orgRltnOutVol"></i></p>
                                <p>缴纳党费金额：<i id="payPtyFeeAmt"></i>（ 当年）
                                </p>
                            </dd>            
                </div>

            </div>  

</div>

            <div class="page5 btn5">
                <div id="situation">            
                            <dd>
                                <p>本年人才网群</p>
                                <p>累计提供岗位量</p>
                            </dd>
                     </div>

            </div>

            <div class="page6  btn6" >
                <div class="gxmap">
                    <div class="table">                
                     <table>
                            <tr>
                                <th>市</th>
                                 <th>平均薪酬</th>
                            </tr>
                            <tr>
                                <td>南宁市</td>
                                <td>3805.46</td>
                            </tr>
                            <tr>
                                <td>南宁市</td>
                                <td>3805.46</td>
                            </tr>                                                       
                        </table>                  
                    </div>
                </div>
            </div>

    </div>

<script  type="text/javascript">
$(function(){

//表示获取到".btn-group"class下的第一个下标为0  的 input，给他加一个class属性为active，

//标签的class属性为active。默认显示

$(".btn-group").find("input").eq(0).addClass("active");

//取到class属性为active下的id的值，然后给他加上css的属性配置
$("."+$(".active").attr("id")).css("display","block");
console.log($(".active").attr("id"));   //输出btn6  表示取到
});
</script>
    <script>
        $(".btn-group input").click(function () {

//获取当前的class添加active属性，然后移除其余的class的active的属性
                $(this).addClass("active").siblings().removeClass("active")

//给当前的class添加一个css的属性，然后其余的去掉css属性
$("."+$(this).attr("id")).css("display","block").siblings().css("display","none");
            })

  </script>

//注释：

$(this).attr(key); 获取节点属性名的值，相当于getAttribute(key)方法 


$(this).attr(key, value); 设置节点属性的值，相当于setAttribute(key,value)方法 


eg:<div id="w_1" class="widget" diywidgetid="${template.diyWidgetId}"></div> 


var diywidgetid = $('#w_1').attr('diywidgetid'); //获取节点属性的值 


$(this).val();获取某个元素节点的value值，相当于$(this).attr(“value”); 


$(this).val(value);设置某个元素节点的value值，相当于$(this).attr(“value”,value); 


eg:<input id="i_eg" value="1" type="text"></input> 


var i_eg=$('#i_eg').val(); // 获取元素节点的value 值

JQuery中的siblings()函数

$("p").siblings(".selected")

<ul>
   <li>list item 1</li>
   <li>list item 2</li>
   <li class="third-item">list item 3</li>
   <li>list item 4</li>
   <li>list item 5</li>
</ul>

$('li.third-item').siblings().css('background-color', 'red');

表示从class为  li.third-item  开始，则可找到该元素的同胞元素,即表示找到除了 li.third-item 以外的全部  li 下的元素，为他们加上css属性