jQuery:1.5.4.1,表格变色(第一行是奇数)-阿里云开发者社区

开发者社区> 吞吞吐吐的> 正文

jQuery:1.5.4.1,表格变色(第一行是奇数)

简介:
+关注继续查看
ylbtech-jQuery:jQuery学习

jQuery语法实例

表格变色
效果截图
 
jQuery:1.5.4.1,表格变色 HTML代码返回顶部
复制代码
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style type="text/css">
        .even{ background-color:Gray;} /*奇数行样式*/
        .odd{ background-color:Yellow;} /*偶数行样式*/
    </style>
    <script src="js/jquery.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("tr:even").addClass("even");  /*给奇数行添加样式*/
            $("tr:odd").addClass("odd");  /*偶数行添加样式*/
        });
    </script>
</head>
<body>
<h3>表格变色</h3>
    <table style="width: 300px;">
        <tr>
            <th>
                
                name</th>
            <th>
                sex</th>
            <th>
                age</th>
        </tr>
        <tr>
            <td>
                rain 
            </td>
            <td>
                male 
            </td>
            <td>
                
                23</td>
        </tr>
        <tr>
            <td>
                rain 
            </td>
            <td>
                male 
            </td>
            <td>
                
                23</td>
        </tr>
        <tr>
            <td>
                rain 
            </td>
            <td>
                male 
            </td>
            <td>
                
                23</td>
        </tr>
        <tr>
            <td>
                rain 
            </td>
            <td>
                male 
            </td>
            <td>
                
                23</td>
        </tr>
        </table>
    <div>注意:$("tr:odd")和$("tr:even")选择器中的索引是从0开始的,因此第一行是奇数</div>
</body>
</html>
复制代码
jQuery:1.5.4.1.B,效果截图返回顶部

 表格变色


本文转自ylbtech博客园博客,原文链接:http://www.cnblogs.com/ylbtech/archive/2013/01/24/2875450.html,如需转载请自行联系原作者

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
jquery 制作的表格效果
                    $(function () {             //表头             $("#salary tr:eq(0)").
613 0
jQuery EasyUI API 中文文档 - 组合表格(ComboGrid)
ComboGrid 组合表格 扩展自 $.fn.combo.defaults 和 $.fn.datagrid.defaults,用 $.fn.combogrid.defaults 重写了 defaults 。
936 0
ParamQuery grid – 仿 MS Excel 和 Google Spreadsheet的jquery表格插件
ParamQuery网页表格是一个轻量级的jQuery插件,其灵感来自MS Excel和谷歌电子表格。它是基于jQueryUI 组件库 。它可以免费使用在任何商业或开源项目。 演示: http://paramquery.
815 0
阿里云服务器端口号设置
阿里云服务器初级使用者可能面临的问题之一. 使用tomcat或者其他服务器软件设置端口号后,比如 一些不是默认的, mysql的 3306, mssql的1433,有时候打不开网页, 原因是没有在ecs安全组去设置这个端口号. 解决: 点击ecs下网络和安全下的安全组 在弹出的安全组中,如果没有就新建安全组,然后点击配置规则 最后如上图点击添加...或快速创建.   have fun!  将编程看作是一门艺术,而不单单是个技术。
3959 0
jQuery EasyUI API 中文文档 - 树表格(TreeGrid)
TreeGrid 树形表格 扩展自 $.fn.datagrid.defaults,用 $.fn.treegrid.defaults 重写了 defaults。 依赖 datagrid 用法 1.
985 0
jQuery EasyUI API 中文文档 - 数据表格(DataGrid)
DataGrid 数据表格 扩展自 $.fn.panel.defaults ,用 $.fn.datagrid.defaults 重写了 defaults 。 依赖 panel resizable linkbutton pagination 用法 1.
1069 0
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,阿里云优惠总结大概有三种登录方式: 登录到ECS云服务器控制台 在ECS云服务器控制台用户可以更改密码、更换系.
5682 0
阿里云ECS云服务器初始化设置教程方法
阿里云ECS云服务器初始化是指将云服务器系统恢复到最初状态的过程,阿里云的服务器初始化是通过更换系统盘来实现的,是免费的,阿里云百科网分享服务器初始化教程: 服务器初始化教程方法 本文的服务器初始化是指将ECS云服务器系统恢复到最初状态,服务器中的数据也会被清空,所以初始化之前一定要先备份好。
10716 0
4008
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
文娱运维技术
立即下载
《SaaS模式云原生数据仓库应用场景实践》
立即下载
《看见新力量:二》电子书
立即下载