Javascript 按标签对复选框排序

所以我有这些带有疯狂ID的复选框，因为我无法更改的原因。例如：

<td>
    <span title=BBB class="ms-RadioText">
        <input id = Checkbox1 type=checkbox/>
        <label for="Checkbox1">BBB</label>
    </span>
    <span title=AAA class="ms-RadioText">
        <input id = Checkbox2 type=checkbox/>
        <label for="Checkbox2">AAA</label>
    </span>
</td>

BBB
AAA

---

当然，它们不是按字母顺序排列的。如何使用本机JavaScript、JQuery或CSS按字母顺序排序，因为我不允许更改HTML中复选框的顺序？

JQuery排序并读取title属性

$（'td'）。每个（函数（）{
var td=$（此）
td.find（'span'）.sort（函数（a，b）{
返回a.title.localeCompare（b.title）
}).附件（td）
})

BBB
AAA
FFF
ZZZ
EEE

您可以利用domapi从父元素中获取

span

元素，对它们重新排序，并将文档片段追加回原始父元素。如下所示：

const orderEls=（）=>{
//获取要排序的元素数组
const spanEls=Array.from（document.queryselectoral（'span'）；
//生成包含已排序els的文档片段
常数frag=spanEls
.sort（（a，b）=>a.title>b.title？1:-1）
.reduce（（累计、跨距）=>{
累加附属物（spanEl）；
返回累计；
}，document.createDocumentFragment（））；
//将已排序的els追加到父项
document.querySelector（'td'）.appendChild（frag）
};
orderEls（）

BBB
AAA
使用香草JavaScript，您可以使用以下函数对复选框进行排序


函数sortcheckboxsbylabel（parentElement）{
var children=Array.prototype.slice.call（parentElement.children），//转换为真数组。
fragment=document.createDocumentFragment（）；
//按字母顺序排序。
排序（（item1，item2）=>item1.querySelector（'label'）.innerText>item2.querySelector（'label'）.innerText？1:-1）；
//添加到片段中。
对于（变量i=0；i}
它们是否都是同一元素中的同级？或者这只是不同的
中的两个？是的，它们都是兄弟姐妹@Patrick roberts是否有特定的查询选择器可用于隔离这些元素？例如，
class=“ms RadioText”
对于这些元素是唯一的，还是
td
具有唯一的属性，例如
id
？class
ms=RadioText
仅对于这些复选框是唯一的，而
td
没有任何唯一的属性。我可能会替换
td.find（'span'）
与
td.children（'.ms RadioText'）
，基于上述评论。