总是要趁着自己还有记忆的时候,把该记录下来的都记录下来,着实是不敢恭维自己的记性。

相信很多时候,我们前端人员,经常会用到table里面的某个td中还嵌套着table,而这个时候还总要去弄奇偶行的颜色,里面那个嵌套的table也要弄。

今天就是这样。如果只是单纯弄最外层的table还好一点。

闲话不多说,先贴个效果图把。

  当然我不会把全部的代码都贴出来,相信大家也写得出来。

  首先最外层的table,我们给它一个class="even_a_mid",给最外层的奇偶行赋予颜色

$(".even_a_mid tr:even").css("background","#eee");

  

  然后给里面的table赋予颜色,开始需求人员说,这个里面嵌套一个table,所以我的写法是这样的。期间,是遇到一个问题的——$(".even_a_mid tr:eq(index) table tr:even").css("background","red");当我这样写时,就没有效果。原因是——eq作为选择器的时候不支持变量,只支持大于等于0的正整数。当你用变量,负数,小数的时候,程序都会把它转换成0。故而改了下面就ok了。

    var index = $(".even_a_mid tr").has("table").index();
$(".even_a_mid tr:eq('"+index+"') table tr:even").css("background","red");

   

  事实上,如果里面嵌套多个table,后面的基本没用了。因为$(".even_a_mid tr").has("table")这部分是一个数组,所以index方法则无效了。接下来要做的事情是,要得到遍历这个数组,等得到每行的index,然而事与愿违。所以换了种方式。

  

$(".even_a_mid tr").has("table").each(function() {
$(this).find("table tr:even").css("background","#fff");
$(this).find("table tr:odd").css("background","#eee");
});

  最后终于就ok了。

  源码链接:http://runjs.cn/detail/vvh9ilip

table中嵌套table,如何用jquery来控制奇偶行颜色的更多相关文章

  1. iview之——table中嵌套input、select等

    使用iview在table中嵌入button是比较常见的需求,但是在table中嵌入input或者select你是否考虑过呢?本文用实例介绍input和select在table中的嵌套. 理解tabl ...

  2. html table奇偶行颜色设置 (CSS选择器)

    :nth-child(n) 选择器匹配属于其父元素的第 N 个子元素,不论元素的类型.n 可以是数字.关键词或公式. 下面的例子, 设置表格的奇偶行背景颜色不同:单独设置表格的第1列背景颜色不同. & ...

  3. 如何修改antd中表格的表头样式和奇偶行颜色交替

    在做antd表格时通常会用到table组件,但是table的表头时给定的,那么怎么修改表头的颜色呢? 这里用的时less的写法,在全局环境中写,所有的table表头都会变成自己定义的颜色 定义好表头的 ...

  4. Java如何使用while和for嵌套循环控制输出数据,使数据奇偶行不同

    /* 题目1 使用Eclipse编写控制台应用程, 使用while循环在控制台打印10行10列的如下图形 □ □ □ □ □ □ □ □ □ □ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ □ □ □ □ ...

  5. td中嵌套table,让table完全填充父元素td

    <table width="100% " cellspacing=0 cellpadding=0 border=1 > <tr> <td style= ...

  6. Lua中的table构造式(table constructor)

    最简单的构造式就是一个空构造式{},用于创建一个空table. 构造式还可以用于初始化数组.例如,以下语句:days = {"Sunday", "Monday" ...

  7. Java&Selenium处理页面Table以及Table中随机位置的数据

    一.摘要 前一段时间公司小伙伴刚刚接触自动化,遇到的一个问题,页面新创建的数据保存后,出现在table中的某个位置,并不一定是第一行还是第几行,这种情况下如何去操控它 本篇博文将介绍处理这个问题的一种 ...

  8. Bootstrap table插件 被选中的行颜色改变

    参考:https://www.jianshu.com/p/1bb4c37ef636 在 bootstrap-table.min.css 中修改源码 //选中行颜色 .fixed-table-conta ...

  9. Jquery Ajax 异步设置Table中某列的值

    可根据table中某列中的ID去改变某列的值! 只是参考,实际应用中不能这样做的,如果有很多行,频繁访问服务器,服务器是顶不住的! JS: $(document).ready(function () ...

随机推荐

  1. java.lang.IllegalArgumentException: Requested window android.os.BinderProxy@450b2f48 异常处理

    晕死的错误,改了半天也没想到是这样的原因,基础正要呀... 先看一下警告信息: 07-07 08:32:19.540: WARN/WindowManager(74): Failed looking u ...

  2. 深入浅出ES6(二):迭代器和for-of循环

    作者 Jason Orendorff  github主页  https://github.com/jorendorff 我们如何遍历数组中的元素?20年前JavaScript刚萌生时,你可能这样实现数 ...

  3. java基础知识回顾之java Socket学习(二)--TCP协议编程

    TCP传输(传输控制协议):TCP协议是一种面向连接的,可靠的字节流服务.当客户端和服务器端彼此交换数据前,必须先在双方之间建立一个TCP连接,之后才能进行数据的传输.它将一台主机发出的字节流无差错的 ...

  4. POJ3414Pots

    http://poj.org/problem?id=3414 题意 : 大意是说给你两个杯子的体积和一个目标体积,a,b,c,通过对a,b进行6种操作,调出c体积的水,6种操作分别是把a倒满,把b倒满 ...

  5. Git stash方法(转)

    命令:git stash1.使用git stash保存当前的工作现场,那么就可以切换到其他分支进行工作,或者在当前分支上完成其他紧急的工作,比如修订一个bug测试提交. 2.如果一个使用了一个git ...

  6. ActiveMQ 学习笔记

    http://somebody-hjh.iteye.com/blog/726050 一.概述 Message,即消息.人与人之间通过消息传递信息.言语.眼神.肢体动作都可被视为消息体.当然还有我们经常 ...

  7. C 语言学习guideline

    Kernighan和Ritchie的<The C Programming Language>(中译名<C程序设计语言>)堪称经典中的经典,不过旧版的很多内容都已过时,和现在的标 ...

  8. erp中三大订单CO、PO、MO各是代表什么?

    ERP即 企业资源计划 (Enterprise Resource Planning),由美国 Gartner Group 公司于1990年提出. ERP系统是指建立在信息技术基础上,以系统化的管理思想 ...

  9. Java Project和Web Project 区别

    java project是java工程,不包括JSP等前台页面的代码 大部分是CS结构的工程和一些jar包 web project是web工程,是BS结构的系统 web project部署到服务器上 ...

  10. 48. Rotate Image

    题目: You are given an n x n 2D matrix representing an image. Rotate the image by 90 degrees (clockwis ...