用js控制父元素中的子元素，不要用css，大神请进
举个例子<divclass="dad"><ul><li></li><li></li><li></li><li></li><li></li><li></li><li></l...
举个例子
<div class="dad">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
一共有10个li
他们的背景颜色都是#000黑色
但我想改变从第四个li开始到第十个li的背景颜色，变成red；
用js来做，不要用css，我就想知道如何操作 展开
<div class="dad">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
一共有10个li
他们的背景颜色都是#000黑色
但我想改变从第四个li开始到第十个li的背景颜色，变成red；
用js来做，不要用css，我就想知道如何操作 展开
2个回答
展开全部
var oLis = document.getElementsByClassName("dad")[0].getElementsByTagName("li");
for(var i = 3;i<oLis.length;i++){
oLis[i].style.backgroundColor = "red";
}这个是原生js写的，因为用的getElementsByClassName有兼容性问题，我就不写解决的函数了
$(function(){
$(".dad").find("li").slice(3).css("backgroundColor","red")
})这个是用JQ写的
这两个你要哪个拿哪个，不懂追问，反正这是小问题，满意劳烦采纳，实在需要原声兼容我补充给你
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<html>
<script src="jquery-1.9.1.js"></script>
<style type="text/css">
li{width:20px;height:20px;background:black;margin-top:20px;}
</style>
<body>
<div class="dad">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<script>
$(function() {
var obj = $(".dad").find("li");
$.each(obj,function(k,v) {
if(k >= 3) {
$(this).css("background","red");
}
})
});
</script>
</body>
</html>
<script src="jquery-1.9.1.js"></script>
<style type="text/css">
li{width:20px;height:20px;background:black;margin-top:20px;}
</style>
<body>
<div class="dad">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<script>
$(function() {
var obj = $(".dad").find("li");
$.each(obj,function(k,v) {
if(k >= 3) {
$(this).css("background","red");
}
})
});
</script>
</body>
</html>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
