JavaScript学习之for循环小例子--斑马线

最新推荐文章于 2022-09-15 19:35:55 发布

原创最新推荐文章于 2022-09-15 19:35:55 发布 · 369 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #斑马线 #for循环

javascript 专栏收录该内容

23 篇文章

订阅专栏

js代码：

<script>
var otr=document.getElementsByTagName("tr");//获取行
//alert(otr.length)
for(var i=0;i<otr.length;i++){
   // 偶数行为粉色，奇数行为灰色
    if(i%2==0)
        otr[i].style.background="pink";
    }else{
        otr[i].style.background="#cccccc";
    }
}

</script>

css样式：

  table{
      height: 1000px;
      width: 100%;
  }

html代码：

<table cellspacing="0" cellpadding="0" border="1">
    <tr>
        <td></td>
    </tr>
    <tr>
        <td></td>
    </tr>
    <tr>
        <td></td>
    </tr>
    <tr>
        <td></td>
    </tr><tr>
    <td></td>
    </tr>
    <tr>
        <td></td>
    </tr>
    <tr>
        <td></td>
    </tr>
    <tr>
        <td></td>
    </tr>

</table>