gpt4 book ai didi

jquery - 仅显示前 6 个 child (JQuery)

转载 作者:太空宇宙 更新时间:2023-11-03 19:45:02 24 4
gpt4 key购买 nike

我有这个样本:

https://jsfiddle.net/trud4930/1/

这是 HTML 代码:

<div class="parent">
<div class="parent2">
<div class="child1"></div>
<div class="child1"></div>
<div class="child1"></div>
<div class="child1"></div>
<div class="child1"></div>
<div class="child1"></div>
<div class="child1"></div>
<div class="child1"></div>
<div class="child1"></div>

</div>

这是 CSS 代码:

    .child1
{
width:50px;
height:50px;
background:blue;
margin-top:10px;
}

.none{display:none;}

这是 JQuery 代码:

jQuery(document).ready(function($) {

$(document).ready(function(){
$( "parent2:lt(6)" ).css( "background:red" );
var max=0;
if(max<=6)
{
// display:normal
}else
{
//addClass .NONE
}


});

});

我希望只显示前 6 个 child 并更改 background-color

我该如何解决这个问题?

提前致谢!

最佳答案

为什么要使用 jQuery,当你可以用纯 CSS 解决它时:

.child1:nth-of-type(-n+6) { /* the first six */
background: red;
}
.child1:nth-of-type(n+7) { /* all but the first six */
display: none
}

Updated Fiddle

关于jquery - 仅显示前 6 个 child (JQuery),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30326674/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com