我需要使用 jQuery 更改网格中元素的顺序。
我有这样的事情:
<div class="products products-grid ">
<div class="box product">
<figure>
<div class="image-table">
<div class="image-cell">
<a href="xxx" class="product-image" >
<img src="xxx" alt="111">
</a>
</div>
</div>
<figcaption>
<div class="product-title">
<a href="xxx" class="title">111</a>
</div>
<span class="price">
<span class="money">xxx</span>
</span>
</figcaption>
</figure>
</div>
<div class="box product">
<figure>
<div class="image-table">
<div class="image-cell">
<a href="xxx" class="product-image" >
<img src="xxx" alt="222">
</a>
</div>
</div>
<figcaption>
<div class="product-title">
<a href="xxx" class="title">222</a>
</div>
<span class="price">
<span class="money">xxx</span>
</span>
</figcaption>
</figure>
</div>
<div class="box product">
<figure>
<div class="image-table">
<div class="image-cell">
<a href="xxx" class="product-image" >
<img src="xxx" alt="333">
</a>
</div>
</div>
<figcaption>
<div class="product-title">
<a href="xxx" class="title">333</a>
</div>
<span class="price">
<span class="money">xxx</span>
</span>
</figcaption>
</figure>
</div>
我需要通过 img src ... 中定义的 alt 更改“products products-grid”中元素的顺序。假设我有多个带有 alt = 222 的“box product”,我希望它们成为“products products-grid”中的第一个元素。我怎么能用 jQuery 做到这一点。
您可以使用 jQuery 轻松完成此操作
// With one item. Just grab it and throw it at the top
$('.products').prepend($('img[alt="222"]').closest('.product'));
使用多个,使用每个功能(可能)
$('img[alt="222"]').each(function(){
$('.products').prepend($(this).closest('.product'));
});
此代码未经测试。语法可能有错误。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句