重新倒序排列li-深圳网站建设-鹏程互联网信息技术

重新倒序排列li

编辑：szpcweb | 时间：2015-10-28

今天在给客户做一个网站时遇到下载文件列表后台没有排序选项，我知道在源代码里修改一个参数就可以实现我想要的结果，但是因为系统使用的是一个C#的开源系统，一般都不建议修改系统源代码。因为一旦修改，日后系统升级，网站就会出现难以预料的各种问题。
总之，在网站模版文件里实现列表内容重新排序！
如下运行结果是：

<ul id="test">
	<li>9</li>
	<li>8</li>
	<li>7</li>
	<li>6</li>
	<li>5</li>
	<li>4</li>
	<li>3</li>
	<li>2</li>
	<li>1</li>
</ul>

-----------------------------------------------------------------------------------------------------------------------------------

DEMO：

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" charset="utf-8" src="http://4.gessyweb.com/scripts/jquery/jquery-1.11.2.min.js"></script>
<title>重新倒序排列li</title>

</head>

<body>
<ul id="test">
	<li>1</li>
	<li>2</li>
	<li>3</li>
	<li>4</li>
	<li>5</li>
	<li>6</li>
	<li>7</li>
	<li>8</li>
	<li>9</li>
</ul>
<script type="text/javascript">
	var liN=$('#test li').length;//获得li总个数
	for(var i=liN;i>=1;i--){
		$('#test').append('<li>'+$('#test li').eq(i-1).html()+'</li>');
		$('#test li').eq(i-1).remove();
		}
</script>
</body>
</html>