js隔行换色

<script>

//加载页面

  onload = function(){

  //获取所有的tr

  var arr = document.getElementsByTagName("tr");

  //判断行的奇偶,添加不同的样式,遍历数组

  for(var i = i;i < arr.length;i++){

  if(i % 2 == 0){

  arr[i].style.backgroundColor="#ffffff";

}else{

  arr[i].style.backgroundColor="#BC680D";

}

}

}

</script>

时间: 2024-08-28 23:05:41

js隔行换色的相关文章

《JS 隔行换色》

/*控制隔行换色的JS*/ $().ready(function(){ $("tr").each(function(i){ this.style.backgroundColor = ['#F8F8F8', '#F2F2F2'][i % 2] }); });

js隔行换色+全选/全部选demo

1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <title></title> 6 <meta name="viewport" content="width=device-width, initial-scale=1"> 7 <script type="text/ja

php29号小结(隔行换色······)

1.给表单加样式,可以用css.php与js.js这三种,其中最好用php与js,现在很推广用这种. css3样式隔行换色(table中) ? 1 tr:nth-child(even){     <br>        background: #cad9ea;    <br>     } php与js隔行换色(table中) ? 1 2 3 function changeColor(){         <br>    var trs = document.getEle

JS实现表格自动隔行换色

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE>JS实现表格自动隔行换色丨石家庄冷风机|</TITLE> </HEAD> <BODY> <style> .t1 {background-color:#C8FC98;text-align:center} .t2 {backgro

JS——表格的隔行换色

1.不使用JS完成表格的隔行换色: <html> <head> <meta charset="utf-8"> <title>成绩登记表格</title> </head> <body> <table width="600" border="1" align="center" cellpadding="5" cellspa

几种实现隔行换色的写法(1中css其余js)

第一种: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>隔行变色</title> <style> *{ margin:0; padding:0; } div{ margin:0 auto; width:80%; height:30px; border:1px solid #000; curs

封装一个简单的隔行换色

代码运行效果:笔者接触JS时间不长,对于传参和封装函数理解不够透彻,经过多次练习稍有感悟,为了加深理解写了这篇简单的隔行换色,希望能对刚接触JS的朋友有所帮助,以下是程序代码:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> *{margin:0;padding:

jQuery实现的table表格隔行换色代码实例

jQuery实现的table表格隔行换色代码实例:下面是一段代码实例,能够实现隔行变色的效果,这是网站人性化措施之一,在实际应用中的使用非常广泛.代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <t

表格隔行换色及删除后仍隔行换色效果(好别扭的标题。。。)

表格隔行换色,有多种写法,可以通过jquery来写,也可以用css3实现. 1.jquery方法 odd,奇数:even,偶数 方法很简单 $("tr:odd").css({background:"#c66",color:"#fff"}); $('tr:even').css({background:"#fff",color:"#333"}); 但是如果删除后,两个一样背景的tr会挨上,怎么解决呢?可以将换行