CSS+JS控制Li背景颜色交替

最新推荐文章于 2020-02-13 15:41:53 发布

iteye_3224

最新推荐文章于 2020-02-13 15:41:53 发布

阅读量177

点赞数

分类专栏： html和css 文章标签： CSS XHTML J# HTML

html和css 专栏收录该内容

63 篇文章

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" target="_blank">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
<html xmlns="<a href="http://www.w3.org/1999/xhtml" target="_blank">http://www.w3.org/1999/xhtml</a>">
<head>
<title>小崔设计</title>
<style>
.l1{background:#0f0}
.l2{background:#f00}
</style>
<script>
function initUl(){
var a=document.getElementsByTagName('ul');
for (var i=0;i<a.length;i++){
var v=document.getElementsByTagName('li');
var ii=1;
for (var j=0;j<v.length;j++){
if (v[j].parentNode==a[i]){
if (ii++%2==0){
v[j].className="l2";
}
else{
v[j].className="l1";
}
}
}
}
}
</script>
</head>
<body οnlοad="initUl()">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>

<ul>
<li>11</li>
<li>22</li>
<li>33</li>
<li>44</li>
<li>55</li>
</ul>

</body>

</html>