jquery交替變換顏色的三種方法 實例代碼
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>even and odd</title>
<script type="text/javascript" src="jquery-1.4.4.js"></script>
<script type="text/javascript" language="javascript">
$(function(){
alert("第一種");
$("tbody tr:even").css("background-color", "red");
$("tbody tr:odd").css("background-color", "yellow");
alert("第二種");
$("tbody tr").each(function (index){
alert(index);
if(0 == index%2)
{
$(this).css("background-color", "blue");
}
if(1 == index%2)
{
$(this).css("background-color", "green");
}
});
alert("第三種");
rows = document.getElementsByTagName("tr");
var length = rows.length;
for(var i=0; i< length;i++){
alert(i);
if(0==i%2){
rows[i].style.backgroundColor="#ffff00";
}else
{
rows[i].style.backgroundColor="#0000FF";
}
}
});
</script>
</head>
<body>
<table border="1">
<tbody >
<tr> <td>aaa</td> <td>aaa</td> <td>aaa</td></tr>
<tr> <td>bbb</td> <td>bbb</td> <td>bbb</td></tr>
<tr> <td>aaa</td> <td>aaa</td> <td>aaa</td></tr>
<tr> <td>bbb</td> <td>bbb</td> <td>bbb</td></tr>
<tr> <td>aaa</td> <td>aaa</td> <td>aaa</td></tr>
<tr> <td>bbb</td> <td>bbb</td> <td>bbb</td></tr>
</tbody>
</table>
</body>
</html>
相關文章
這篇文章主要介紹了JQuery中上下文選擇器實現(xiàn)方法,涉及jQuery操作頁面元素的相關技巧,需要的朋友可以參考下2015-05-05
多行文字圖片滾動效果的實現(xiàn)方法有很多，本例與大家分享的是jquery實現(xiàn)的具體步驟，很實用的2014-10-10
本篇文章主要介紹了jquery replace方法去空格的相關知識，具有很好的參考價值。下面跟著小編一起來看下吧2017-05-05
基于jquery的一個OutlookBar類，動態(tài)創(chuàng)建導航條
初學jquery，如有錯誤，請高手們指出想看效果及完整代碼的可以下載rar包2010-11-11
jQuery獲取訪問者IP地址的方法(基于新浪API與QQ查詢接口)
這篇文章主要介紹了jQuery獲取訪問者IP地址的方法,實例分析了jQuery基于新浪API與QQ查詢接口獲取來訪者IP的相關參數(shù)傳遞與數(shù)據(jù)處理技巧,需要的朋友可以參考下2016-05-05
修改jQuery.Autocomplete插件 支持中文輸入法 避免TAB、ENTER鍵失效、導致表單提交
jQuery.Autocomplete 是jquery的流行插件，能夠很好的實現(xiàn)輸入框的自動完成(autocomplete)、建議提示(input suggest)功能，支持ajax數(shù)據(jù)加載。2009-10-10
這篇文章主要介紹了jQuery實現(xiàn)獲取綁定自定義事件元素的方法,涉及jQuery方法重載、事件綁定及元素操作的相關技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-12-12
jQuery使用load()方法載入另外一個網(wǎng)頁文件內(nèi)的指定標簽內(nèi)容到div標簽的方法
這篇文章主要介紹了jQuery使用load()方法載入另外一個網(wǎng)頁文件內(nèi)的指定標簽內(nèi)容到div標簽的方法,涉及jQuery中l(wèi)oad方法的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-03-03
Ajax使用的關鍵對象是XmlHttpRequest對象，但是涉及到跨瀏覽器的的問題，所以，需要創(chuàng)建一個具兼容性的對象2011-04-04
這篇文章主要為大家詳細介紹了jquery實現(xiàn)界面點擊按鈕彈出懸浮框，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-03-03