重新倒序排列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>