代码如下:
<!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> 隔行换色</title> <mce:script type="text/javascript" src="common/jquery-1.2.6.min.js" mce_src="common/jquery-1.2.6.min.js"></mce:script> <link type="text/css" rel="stylesheet" href="common/common.css" mce_href="common/common.css" /> <mce:style><!-- /* 隔行换色 */ .demoOver{background:#ccc;} .demoBg{background:#f1f1f1;} --></mce:style><style mce_bogus="1">/* 隔行换色 */ .demoOver{background:#ccc;} .demoBg{background:#f1f1f1;}</style> </head> <body> <mce:script type="text/javascript"><!-- // 隔行换色 $(function(){ $(".demo ul li").mouseover(function(){ $(this).addClass("demoOver"); }).mouseout(function(){ $(this).removeClass("demoOver"); }) $(".demo ul li:even").addClass("demoBg"); }) // --></mce:script> <!-- 隔行换色 --> <div class="demo"> <ul> <li>脚本学堂_www.jb200.com,欢迎大家的光临。</li> <li>脚本学堂_www.jb200.com,欢迎大家的光临。</li> <li>脚本学堂_www.jb200.com,欢迎大家的光临。</li> <li>脚本学堂_www.jb200.com,欢迎大家的光临。</li> <li>脚本学堂_www.jb200.com,欢迎大家的光临。</li> </ul> </div> </body> </html>