Question

我创建了一个包含href中图片的图片库，这些图片会根据他们的课程（.cata，.catb，.catc）通过javascript过滤。

<div class="section galleryholder">
    <a href="images/trends1.jpg" class="eb cata"><img src="images/trends1.jpg" /></a>
    <a href="images/trends2.jpg" class="eb catb"><img src="images/trends1.jpg" /></a>
    <a href="images/trends3.jpg" class="eb cata"><img src="images/trends1.jpg" /></a>
    <a href="images/trends4.jpg" class="eb catc"><img src="images/trends1.jpg" /></a>
    <a href="images/trends5.jpg" class="eb catb"><img src="images/trends1.jpg" /></a>
</div>

我已经通过css应用了一些样式，根据css-selector nth-of-type显示不同的hrefs和包含图像的网格：

.eb{
    float:left;
    display:inline-block;
    width:33.33333333%;
    margin:0;
    position:relative;
    text-decoration:none;
    overflow:hidden;
}

.eb:nth-of-type(3n+1) {
    width:66.66666667%;
}

.eb:nth-of-type(6n+1), .eb:nth-of-type(6n+2), .eb:nth-of-type(6n+3){
    float:right;
}

.eb img{
    width:100%;
    height:auto;
}

目前我通过jquery（.hide()和.show()）隐藏并显示我画廊中的href。问题是，在css中应用的nth-type-selector当然不会重绘所显示的元素，因为元素不会从DOM中删除，只能隐藏。

由于我希望能够再次显示隐藏的元素，我认为从DOM中删除匹配的元素不是一个好习惯，我决定将.eb元素的类切换到另一个类。但是这不会给我想要的结果再次计算匹配的元素并且也没有应用适当的样式。

有什么建议吗？

Answer 1

我对这个问题的解决方法如下：我克隆了元素改变了他们的类，将它们包装在div中并将div放在原始元素之后。然后我从dom中删除了原始元素。为了再次显示元素，我打开它们并改变了他们的课程。

如何使用jquery操作元素，以便它们匹配css-Selector＆＃34; nth-of-type＆＃34;

1 个答案: