按照首先字母进行元素排序

最新推荐文章于 2023-02-22 17:07:32 发布

理个以哈呦

最新推荐文章于 2023-02-22 17:07:32 发布

阅读量961

点赞数

分类专栏： jQuery js

js 同时被 2 个专栏收录

79 篇文章 0 订阅

订阅专栏

jQuery

23 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>按照首先字母进行元素排序</title>
<script src="jquery/jquery-1.9.1.js"></script> 
<script type="text/javascript">
  $(document).ready(function(){
      $("#btnsort").click(function(){       //单按钮进行排序
      sortLocal($("ul"));                     //调用sortLocal进行排序
      });
  });
  //定义一个用于排序的函数sortLocal用于进行排序
  function sortLocal(sort_container, sort_item) {
      var list_items = sort_container.children(sort_item).get();  //得到子元数数组
      list_items.sort(function(a, b) {                           //调用localCompare进行排序
         return $(a).text().toUpperCase().localeCompare($(b).text().toUpperCase());
      });
      $.each(list_items, function(index, item) {                //循环输出排序后的数组
        sort_container.append(item);
      });
  }  
</script>
</head>

<body>
<button id="btnsort">单击这里排序</button>
<ul>
  <li>我的中国心</li>
  <li>你的中国梦</li>
  <li>人们的中国梦</li>
  <li>中华民族</li>
  <li>伟大的中国</li>
</ul>
</body>
</html>