完美排序10000条数据
看到一道面试题：<ul>有 10000 个<li>子元素，如何将这 10000 个<li>颠倒顺序。
-------------
要求是效率尽量要高。不光是算法效率，还要考虑DOM元素操作的效率。大家有什么想法？
还有就是遇到类似这种问题解题技巧？
-------------
答：以下利用了css3旋转属性，将li翻转，同时再ul翻转。完美的倒排！
http://lax.v2ex.com/t/100982 出自5楼
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <title>测试</title> <style> /* 看到一道面试题：<ul>有 10000 个<li>子元素，如何将这 10000 个<li>颠倒顺序。 ------------- 要求是效率尽量要高。不光是算法效率，还要考虑DOM元素操作的效率。大家有什么想法？ 还有就是遇到类似这种问题解题技巧？ ------------- 答：以下利用了css3旋转属性，将li翻转，同时再ul翻转。完美的倒排！ */ ul,li{ transform: rotate(180deg); -ms-transform: rotate(180deg); /* IE 9 */ -webkit-transform: rotate(180deg); /* Safari and Chrome */ -o-transform: rotate(180deg); /* Opera */ -moz-transform: rotate(180deg); /* Firefox */ list-style-type:none; } </style> </head> <body> <ul> <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> <li>这是第10行</li> <li>这是第11行</li> <li>此处省略数千行</li> <li>。。。。。</li> <li>这是第9998行</li> <li>这是第9999行</li> <li>这是第10000行</li> </ul> </body> </html>
来自: http://www.oschina.net/code/snippet_1258821_35227