0

目前在 Squarespace.com 平台上工作，我想重新排序默认为字母排序的动态博客类别索引。这是 Squarespace 生成代码的方式：

<div id="moduleContentWrapper11663355" class="widget-wrapper widget-type-journalarchive">
    <div id="moduleContent11663355">
        <ul class="archive-item-list-pt">
            <li>
            <a href="/blog/category/category-one">Category One</a>
            <span class="entry-count">(1)</span>
            </li>
            <li>
            <a href="/blog/category/category-two">Category Two</a>
            <span class="entry-count">(1)</span>
            </li>
            <li>
            <a href="/blog/category/category-three">Category Three</a>
            <span class="entry-count">(1)</span>
            </li>
        </ul>
    </div>
</div>

是否可以使用 Jquery 重新排序条目，或者更糟糕的情况，我可以为每个条目附加一个唯一的 CSS 类，<li>以便我可以使用 CSS 操作每个条目吗？

谢谢！

4

5 回答 5

4

dom 只不过是一个复杂的集合......你可以使用 jquery 像数组一样对 li 进行排序。

var mylist = $('#moduleContent11663355 > ul');
var listitems = mylist.children('li').get();
listitems.sort(function(a, b) {
   var compA = $(a).text().toUpperCase();
   var compB = $(b).text().toUpperCase();
   return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;
})
$.each(listitems, function(idx, itm) { mylist.append(itm); });

感谢http://www.onemoretake.com/2009/02/25/sorting-elements-with-jquery/

于 2011-08-22T17:29:43.380 回答
3 
var i = 1;
$('.archive-item-list-pt li').each(function(item) {
   $(item).addClass('myClass'+i);
});
于 2011-08-22T17:26:30.417 回答
2 
$('.archive-item-list-pt li').each(function(i,j) {
   $(this).addClass('yourClass'+i);
});

这是小提琴http://jsfiddle.net/h2gfT/7/

更新

$('.archive-item-list-pt li').each(function(i,j) {
   var cls=$(this).children("a").text().toLowerCase();
    var idx = cls.replace(' ','-');

    $(this).addClass(idx);
});

这是小提琴http://jsfiddle.net/h2gfT/9/

一个带有 jquery 链接热度的

$('.archive-item-list-pt li').each(function(i,j) {
   var cls=$(this).children("a").text().toLowerCase().replace(' ','-');  
   $(this).addClass(cls);
});

http://jsfiddle.net/h2gfT/11/

于 2011-08-22T17:40:35.047 回答
0

根据任意键功能对项目进行就地排序

http://blog.mirotin.net/125/jquery-sortitems

于 2011-08-23T09:30:05.530 回答
-1

使用 jQuery 对条目进行排序可以通过几种不同的方式完成，但如果您只想将 CSS 附加到每个条目上，您可以通过两种不同的方式来完成。

$('li').each(function(l) { $(this).attr('class', '<insertnameofcssclasshere>') })

或者

$('li').each(function(l) { $(this).css(<insertcssstuff here>) })

当然，这些会将其应用于页面上的所有 li 元素。如果您只想影响其中的一些，您会想要使用更具体或包含的选择器。

于 2011-08-22T17:29:09.263 回答