html+css+js如何实现以下功能
比如有n个div每个都进行if判断若数据库有该信息就显示,若无该信息就隐藏,想第一个显示的div灰色背景第二个显示的div白色背景,第三个灰色背景,四四格白色背景,以此类...
比如有n个div 每个都进行if判断 若数据库有该信息就显示,若无该信息就隐藏,想第一个显示的div灰色背景第二个显示的div白色背景,第三个灰色背景,四四格白色背景,以此类推,就是说显示的奇数个的时候背景是一种颜色,偶数时候是另一种颜色,用代码如何实现,谢谢了
展开
3个回答
展开全部
举个例子:
用jquery来实现的话太简单了、前提是你页面中有引入jquery库。没有的话自己下一个jquery,然后引入页面就OK了。
实现原理就是通过js给为奇数的div一个为sytle01的类名。为偶数的div给一个style02类名,类名可以自己随便设置。然后能CSS给相应的类定义样式就OK了。
html例子:
<div class="div001">
<div>灰色灰色灰色灰色灰色灰色</div>
<div>白色白色白色白色白色白色</div>
<div>灰色灰色灰色灰色灰色灰色</div>
<div>白色白色白色白色白色白色</div>
</div>
jquery代码:
$(document).ready(function () {
$(".div001 div:even").attr("class","style01"); //这里的.div001对应html里面的class=“div001”
$(".div001 div:odd").attr("class","style02");
});
CSS 样式:
.style01{background:#eee;}
.style02{background:#fff;}
用jquery来实现的话太简单了、前提是你页面中有引入jquery库。没有的话自己下一个jquery,然后引入页面就OK了。
实现原理就是通过js给为奇数的div一个为sytle01的类名。为偶数的div给一个style02类名,类名可以自己随便设置。然后能CSS给相应的类定义样式就OK了。
html例子:
<div class="div001">
<div>灰色灰色灰色灰色灰色灰色</div>
<div>白色白色白色白色白色白色</div>
<div>灰色灰色灰色灰色灰色灰色</div>
<div>白色白色白色白色白色白色</div>
</div>
jquery代码:
$(document).ready(function () {
$(".div001 div:even").attr("class","style01"); //这里的.div001对应html里面的class=“div001”
$(".div001 div:odd").attr("class","style02");
});
CSS 样式:
.style01{background:#eee;}
.style02{background:#fff;}
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
用jQuery行
$(document).ready(function(){
var divArr = jQuery("div");
for(var i=0;i<divArr.length;i++){
/*设置显示/隐藏*/
if(divArr[i]在数据库中){
divArr[i].className = "show";
}else{
divArr[i].className = "hide";
}
/*隔行变色*/
jQuery("div.show:even").css("background","#ffffff");
jQuery("div.show tr:odd").css("background","#f8f8f8");
}
});
$(document).ready(function(){
var divArr = jQuery("div");
for(var i=0;i<divArr.length;i++){
/*设置显示/隐藏*/
if(divArr[i]在数据库中){
divArr[i].className = "show";
}else{
divArr[i].className = "hide";
}
/*隔行变色*/
jQuery("div.show:even").css("background","#ffffff");
jQuery("div.show tr:odd").css("background","#f8f8f8");
}
});
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
映入jQuery 框架啊。。
会简单很多。。
会简单很多。。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询