zoukankan      html  css  js  c++  java
  • js04 表格隔行换色的案例

    案例3-隔行换色
    需求:
    一个表格,隔一行换一个色
    技术分析:
    事件:onload  什么时候变色 表格加载完后变色 //页面加载成功


    获取元素:dom操作
    ///////////////
    获取元素:
    document.getElementById("id"):通过id获取一个元素

    //1.获取所有的tr标签
    document.getElementsByTagName("标签名"):通过标签名获取一种元素(多个)返回一个数组
    Array:?数组吗?


    常用属性:
    length:数组的长度
    ////////////////////////
    步骤分析:
    1.html表格一加载的时候 确定事件 onload 
    2.编写函数
    a.获取元素(所有的tr元素)
    b.操作(若当前行是偶数的话加一个样式,若是奇数的话,加另一个样式)
    ////////
    //页面加载成功
    onload=function(){
    //1.获取所有的tr
    var arr=document.getElementsByTagName("tr");//数组类型 可以省去     

    数组引用类型:var myArray=new Array()

     
    //alert(arr);
    //alert(arr.length);

    //2.判断奇偶数 添加不同的样式 遍历数组
    for(var i=1;i<arr.length;i++){
    if(i%2==0){
    arr[i].style.backgroundColor="#FFFFCC"; //设置每一行的  css的 属性 样式 标签的style属性
    }else{
    arr[i].style.backgroundColor="#BCD68D";
    }
    }

    }
    //////////////////////////

  • 相关阅读:
    运维岗春招--part2
    python 题库|刷题
    leetcode刷题
    运维面经汇总
    python自动化运维阅读笔记
    Python编程汇总
    old_boy 运维学习-第一期
    团队博客作业-Week3
    个人对final发布产品的排名
    各组对final发布产品的排名
  • 原文地址:https://www.cnblogs.com/nextgg/p/7715929.html
Copyright © 2011-2022 走看看