【表格奇偶行】对奇偶行附加不同的样式

◇组件名称:

    表格奇偶行

◇功能描述：

   为表格的奇数数行和偶数行添加不同的样式 。

◇调用方法：

    addLoadEvent(stripeTables);

◇上下文情景：

    用以修饰表格，css很难做到隔行附加相同样式，用js轻松实现。

◇工作方式&技术要点

    ·遍历table中的tr，设置变量odd，每次循环后都改变它的值，两个值交替判断赋予不同样式。

◇关键代码展示

function stripeTables() {
  if (!document.getElementsByTagName) return false;
  var tables = document.getElementsByTagName("table");
  for (var i=0; i<tables.length; i++) {
    var odd = false;
    var rows = tables[i].getElementsByTagName("tr");
    for (var j=0; j<rows.length; j++) {
      if (odd == true) {
        addClass(rows[j],"odd");
        odd = false;
      } else {
        odd = true;
      }
    }
  }
}

◇DEMO演示

    点此打开DEMO