如何使用Javascript按字母顺序区分大小写对表格进行排序

How do I sort a table with Javascript in alphabetical order with case sensitivity?

本文关键字：大小写 表格 排序 顺序区 Javascript 何使用      更新时间：2023-09-26

没有jQuery答案，因为我在这个网站上没有使用它。

我有一张通用表格

<tbody><tr><td>2</td><td><a href="http://www.anime-planet.com/anime/ah-my-goddess">Ah! My Goddess</a></td></tr></tbody>

我需要访问"a"元素的内部文本，但我不确定如何做到这一点。我想使用querySelectorAll，但显然，因为表是由javascript通过ajax生成的，所以我无法做到这一点。这让我不确定如何访问元素，更不用说对其文本内容进行排序了，比如"啊！我的女神。需要注意的是，还有更多类似这样的表行，具有相同的基本模式。

如果不使用jQuery，您可以尝试使用它所基于的函数的根。例如，将选择器替换为：

document.querySelectorAll('td').textContent

我假设您可以通过id:引用该表

var t = document.getElementById(/*table id*/);
var d = t.tBodies[0].rows; // is an HTMLCollection, kinda like an array
d = [...t.tBodies[0].rows]; // converts it into an array of rows

一旦它在数组中，就可以对行执行类似数组的操作，比如sort()它们是

现在，查看第一行d[0]，并假设锚点总是在第二列中，该锚点可以称为：

var a = d[0].cells[1].getElementsByTagName('a')[0];

打开/关闭标签内的文本为：

a.innerHTML; // In this case: 'Ah! My Goddess'

把这些放在一起，一种排序（按字母顺序）可能是：

var byAnchorText = (a, b) => a.cells[1].getElementsByTagName('a')[0].innerHTML - b.cells[1].getElementsByTagName('a')[0].innerHTML;
var t = document.getElementById(/*table id*/);
Array.sort.apply(t.tBodies[0].rows, byAnchorText);

或者类似的东西，你可以根据自己的意愿进行修复。

相关文章：