jQuery学习笔录9（jQuery中的Table操作）

来源：互联网发布：网络综合布线系统编辑：程序博客网时间：2024/06/08 07:30

 1jQuery(function(){}) 或$(function(){});  它是$(document).ready() 的简写

2 even偶数，odd 奇数

3 siblings（）， > ,find() , addClass() ,removeClass() , css() , 多个 : ,:contains()

选中的行，高亮

<head runat="server">    <title>Untitled Page</title>    <script src="../scriptJquery/jquery-1.3.2.min.js"></script>    <style type="text/css">        .even{ background:#fff38f;}        .odd{background:green;}        .hightLight{background:pink;}    </style></head><body>  <table>    <thead>        <tr><th>姓名</th><th>性别</th><th>暂住地</th></tr>    </thead>    <tbody>        <tr class="odd"><td><input type="radio" /></td><td>张山</td><td>男</td><td>浙江宁波</td></tr>        <tr class="even"><td><input type="radio" /></td><td>里斯</td><td>女</td><td>浙江郑州</td></tr>        <tr class="odd"><td><input type="radio" /><td>爱喜</td><td>男</td><td>浙江温州</td></tr>        <tr class="even"><td><input type="radio" /><td>松松</td><td>男</td><td>浙江宁波</td></tr>        <tr class="odd"><td><input type="radio" /><td>耳环</td><td>nv</td><td>浙江杭州</td></tr>    </tbody>  </table></body></html><script>    $(function(){//        $("tr:.odd").addClass("odd");//这是过滤类//        $("tr:.even").addClass("even");//        $("tr:odd").addClass("odd"); //这个选择器中索引时从0开始的,但是把表头也算进去了；//        $("tr:even").addClass("even");        $("tbody:tr:odd").addClass("odd");//把标题过掉        $("tbody:tr:even").addClass("even");        $("tr:contains('松松')").css("background","pink");//高亮”松松“        $("tbody>tr").click(function(){            $(this).addClass("hightLight")            .siblings().removeClass("hightLight").end()            .find("input[type=radio]").attr("checked",true);         // .siblings().find("input[type=radio]").attr("checked",false); //提示错误 not a function         //原因：这样找到的兄弟节点是基于find找到，找到范围是<td>的            $(this).siblings().find("input[type=radio]").attr("checked",false);        })              })</script>

判断checkbox是否被checked上

    $("tbody>tr").click(function(){        if($(this).find("input[type=checkbox]").attr("checked")==true)        {            $(this).addClass("hightLight")        }        else        {            $(this).revomeClass("hightLight");        }    })