Question

您好我有这个问题，我使用magento而我找不到一个地方如何切换我的标签位置所以我认为JQuery可能会出现。所以这就是我的例子

<li id="tab-4">
<li id="tab-3">
<li id="tab-2">
<li id="tab-1">

我需要做到这一点

<li id="tab-1">
<li id="tab-2">
<li id="tab-3">
<li id="tab-4">

有快速的方法吗？或者我必须一个接一个地做？

Answer 1

我猜你身边有<ul> <{1}}

<li>

ul = $('ul'); // your parent ul element
ul.children().each(function(_,li){ul.prepend(li)})

Answer 2

纯JS解决方案。

＆＃13;

var a = document.getElementsByTagName('li');
var b = document.getElementById('list');
var arr = [];

Array.from(a).forEach(v => arr.push(v));
arr.reverse().forEach(v => b.append(v));

＆＃13;

<ul id='list'>
  <li id="tab-4">4</li>
  <li id="tab-3">3</li>
  <li id="tab-2">2</li>
  <li id="tab-1">1</li>
</ul>

＆＃13;

Answer 3

此外，无论初始订单如何，对于溶剂工作（实际排序），您可以使用sort()和append，如下所示：

＆＃13;

$("ul li").sort(function(a,b){
    if(a.id.substring(4, 5) < b.id.substring(4, 5)) {
        return -1;
    } else {
        return 1;
    }
}).each(function() { $('ul').append(this);});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li id="tab-4">4</li>
  <li id="tab-1">1</li>
  <li id="tab-3">3</li>
  <li id="tab-2">2</li>
</ul>

＆＃13;

Answer 4

#include "your-header-file-that-define-the-class.h"
#define YYSTYPE your-class-type
#include "the-header-file-that-made-by-yacc.h"

 $(".list > li").detach().sort(function(a, b) {
				return +a.id.replace("tab-","") - b.id.replace("tab-","") ;
			 }).appendTo("ul.list");

如果您的HTML代码是这样的，则可以使用detach和单个appendTo这样编写代码。

有关detach（）的更多信息：https://www.w3schools.com/jquery/html_detach.asp

如何使用jquery基于id属性对列表项进行排序？

4 个答案: