主页 / 问题 / 679628
Accepted
Артём PeGaS
Asked:2020-06-15 19:38:18 +0000 UTC2020-06-15 19:38:18 +0000 UTC

如何按字母顺序对链接进行排序

  • 772

有了这个，我只对文本进行了排序，但链接保留在原来的位置。排序后如何让链接文字与链接地址匹配？

var x = $('ul li').length;
var mas = [];
var mas2 = [];
$('ul li').each(function( index ) {
  mas[index] = $(this).text();
 mas2[index] = $(this).find('a').attr('href');
});
mas.sort();
$( 'ul li' ).each(function( index ) {
 $(this).find('a').text( mas[index]);
  $(this).find('a').attr( 'href', mas2[index] );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li><a href="h1">7</a></li>
  <li><a href="h2">6</a></li>
  <li><a href="h3">5</a></li>
  <li><a href="h4">4</a></li>
  <li><a href="h5">3</a></li>
  <li><a href="h6">2</a></li>
  <li><a href="h7">1</a></li>
</ul>

javascript

1 个回答

  1. Best Answer

    sort 方法有一个参数 - 一个比较函数，它返回一个字符串，算法将根据该字符串比较数组的元素。该数组包含所选对象的子项，即<ul>tags <li>。通过设置构成已排序元素的标记的innerHTML属性，将已排序的序列插入回页面。这似乎是替换任何标签内容的最简单方法。

    事实证明，不使用 jQuery 代码更容易编写，所以不用它。

    var container = document.getElementById('cont');
var elements = [].slice.call(container.children);
elements.sort(el => el.textContent);
container.innerHTML = elements.map(el => el.outerHTML).join("");
    <ul id="cont">
  <li><a href="h1">7</a></li>
  <li><a href="h2">6</a></li>
  <li><a href="h3">5</a></li>
  <li><a href="h4">4</a></li>
  <li><a href="h5">3</a></li>
  <li><a href="h6">2</a></li>
  <li><a href="h7">1</a></li>
</ul>

    • 3

相关问题