zoukankan      html  css  js  c++  java
  • 表格改变颜色

    <table id="tb">
    <tbody>
    <tr><td>第一行</td><td>第一行</td></tr>
    <tr><td>第二行</td><td>第二行</td></tr>
    <tr><td>第三行</td><td>第三行</td></tr>
    <tr><td>第四行</td><td>第四行</td></tr>
    <tr><td>第五行</td><td>第五行</td></tr>
    <tr><td>第六行</td><td>第六行</td></tr>
    </tbody>
    </table>
    

      js代码

    <script type="text/javascript">
    window.onload = function(){ //页面所有元素加载完毕
    	var item  =  document.getElementById("tb");			//获取id为tb的元素(table)
    	var tbody =  item.getElementsByTagName("tbody")[0];	//获取表格的第一个tbody元素
    	var trs =   tbody.getElementsByTagName("tr");	        //获取tbody元素下的所有tr元素
    	for(var i=0;i < trs.length;i++){//循环tr元素
    		if(i%2==0){        //取模. (取余数.比如 0%2=0 , 1%2=1 , 2%2=0 , 3%2=1)
    			trs[i].style.backgroundColor = "#888"; // 改变 符合条件的tr元素 的背景色.
    		}
    	}
    }
    </script>
    

      jq代码

    <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
    <script language="javascript" >
    	$(function(){// dom元素加载完毕
    	   $('#tb tbody tr:even').css("backgroundColor","#888");
    	   //获取id为tb的元素,然后寻找他下面的tbody标签,再寻找tbody下索引值是偶数的tr元素,
    	   //改变它的背景色.
    	})
    </script>
    

      

  • 相关阅读:
    HDU 1594 find the max
    mongoose 数据库操作2
    我也来开发2048之终极奥义
    cocos2d-x 2.2.0 怎样在lua中注冊回调函数给C++
    windows常用运行命令
    机器学习——Pandas库
    搭建靶场环境
    Ubuntu快速安装MSF
    docker 基本使用
    linux下杀死进程
  • 原文地址:https://www.cnblogs.com/Xuman0927/p/5264511.html
Copyright © 2011-2022 走看看