如何使用JavaScript对HTML列表进行排序？
要使用JavaScript对HTML列表进行排序，代码如下-
示例
<!DOCTYPE html>
<html>
<body>
<h1>Sorting list example</h1>
<button>Click to sort</button>
<ul class="animalList">
<li>Giraffe</li>
<li>Camel</li>
<li>Dog</li>
<li>Lion</li>
<li>Cheetah</li>
<li>Cat</li>
</ul>
<script>
document .getElementsByTagName("button")[0] .addEventListener("click", sortList);
function sortList() {
var list, i, sortFlag, LiEle, sorted;
list = document.querySelector(".animalList");
sortFlag = true;
while (sortFlag) {
sortFlag = false;
LiEle = list.getElementsByTagName("LI");
for (i = 0; i < LiEle.length - 1; i++) {
sorted = false;
if ( LiEle[i].innerHTML.toLowerCase() > LiEle[i + 1].innerHTML.toLowerCase() ) {
sorted = true;
break;
}
}
if (sorted) {
LiEle[i].parentNode.insertBefore(LiEle[i + 1], LiEle[i]);
sortFlag = true;
}
}
}
</script>
</body>
</html>
输出结果
上面的代码将产生以下输出-
在点击“点击排序”按钮-
-
问题内容： 我有一组三个列表项，它们希望在页面加载时从高到低自动显示。理想情况下使用jquery或javascript。 每个列表项都需要有自己的ID，因为它们每个都有各自的背景图像。数字必须是文本节点，以便用户可以编辑它们。 问题答案： 这可能是最快的方法，因为它不使用jQuery： 像下面这样调用函数： 您可以以相同的方式对其他列表进行排序，如果列表类在同一页面上还有其他元素，则应给您的ul一
-
本文向大家介绍如何使用JavaScript对HTML表格进行排序？，包括了如何使用JavaScript对HTML表格进行排序？的使用技巧和注意事项，需要的朋友参考一下 排序使用JavaScript的HTML表格，代码如下 - 示例 输出结果 上面的代码将产生以下输出 - 在点击排序按钮-
-
问题内容： 我正在寻找一种表排序解决方案（使用JavaScript），但似乎还找不到合适的解决方案。我只需要按字母顺序对每一列进行排序。它不需要忽略任何代码或任何数字或使用货币。只需单击列标题即可将其从排序的z / za中切换出来。 有人知道这样一个非常简单的解决方案吗？ 问题答案： 纯Javascript（ES6） 进行字母和数字排序-升序和降序 可在 Chrome ， Firefox ， Sa
-
问题内容： 我的清单包含大小等的集合。我尝试这样做，但似乎不起作用。 我想要的最终结果是。 我可以尝试添加在所有的元素和那种出来再做出新的的。但是，有某种班轮吗？ 更新： 这可行，但是可以简化吗？ 问题答案： @Eugene的回答很甜蜜，因为番石榴很甜。但是，如果您碰巧在类路径中没有番石榴，这是另一种方式： 首先，我将所有集合映射到一个流中，然后对所有元素进行排序，最后，将整个排序后的流收集到集合
-
问题内容： 我知道这是很基本的事情，但是Google搜索并没有显示单击链接后如何对行进行重新排序。 我有这个： 我需要能够按字母顺序单击并排序，然后单击或并按日期排序。我看到我需要MySQL查询来执行此操作，但是是否将它们设置为带有标签的条件查询？ 问题答案： 最简单的方法是在您的列标题上放置一个链接，指向同一页面。在查询字符串中，放置一个变量，以便您知道他们单击了什么，然后在SQL查询中使用OR
-
我有代码，我已经使用列表来存储数据。我想对它的数据进行排序，那么有没有办法对数据进行排序，或者我必须通过比较所有的数据手动进行排序？