Question

如何使用jQuery向上（向后）移动列表中一系列链接的href属性？

这是我的清单：

<ul id="mylist">
  <li><a href="#one">1</a></li>
  <li><a href="#two">2</a></li>
  <li><a href="#three">3</a></li>
</ul>

需要：

<ul id="mylist">
  <li><a href="#two">1</a></li>
  <li><a href="#three">2</a></li>
  <li><a href="#one">3</a></li>
</ul>

最好在某种$ .each（）循环中执行此操作吗？内部文本和href值是动态的。

$('#mylist a').each(function(i) { ??? });

不确定如何实际存储当前的href并将其移动到前一个href，同时对前一个href执行相同操作...然后将第一个移动到最后一个。

Answer 1

jQuery.fn.reverse = [].reverse;

var $li = $('#mylist li a');
var prevhref = $li.first().attr('href');
$li.reverse().each(function() {
    var $this = $(this);
    var nexthref = $this.attr('href');
    $this.attr('href', prevhref);
    prevhref = nexthref;
});

类似，螨虫更快：

jQuery.fn.reverse = [].reverse;

var $li = $('#mylist li a');
var prevhref = $li[0].getAttribute('href');
$li.reverse().each(function() {
    var nexthref = this.getAttribute('href');
    this.setAttribute('href', prevhref);
    prevhref = nexthref;
});

Answer 2

快速且未经测试：

    var elements = $('#mylist a');

    for (var i = 0; i < elements.length - 1; i++) {
      var t = $(elements[i + 1]).attr('href');
      $(elements[i + 1]).attr('href') = $(elements[i]).attr('href');
      $(elements[i]).attr('href') = t;
    }

Answer 3

无法想到如何使用内置方法，但循环工作正常

var items = $('#mylist a'), lastItem, thisItem;
//hold onto the first href for a bit, we'll apply it to the last one once we're done
var firstHref = items.first().attr('href')
//spin through the rest
for (var i = 0; i< items.length; i++) {
    thisItem = items.eq(i);
    if (lastItem) {
        lastItem.attr('href', thisItem.attr('href'));
    }
    lastItem = thisItem;
}
items.last().attr('href', firstHref);

Try it live

将属性移动到列表中的上一个项目

3 个答案: