如何使用Javascript对html内容进行排序（按作者排序、按日期排序等）

我最近开始学习javascript，所以我知道的还不多，这就是为什么我需要一些帮助和指导，我想在页面上制作一个带有链接的图像列表，例如，单击“按作者排序”或“按日期排序”后，这些图像可以按我想要的顺序排序。。我试着做点什么：

   Javascript:

   var wspeare = document.getElementsByClassName("willimshakespeare");
   var jgreen = document.getElementsByClassName("johngreen");
   function Sortbyauthor(author) {
   this.author = author;
   if (author === "williamshakespeare") {
   for(i=0; i<wspeare.length; i++) {wspeare[i].style.display="block";}  
   for(i=0; i<jgreen.length; i++) {jgreen[i].style.display="none";}
   };      
   else if (author === "johngreen") {
   for(i=0; i<wspeare.length; i++) {wspeare[i].style.display="none";}   
   for(i=0; i<jgreen.length; i++) {jgreen[i].style.display="block";}
   };

  HTML:

  <li class="williamshakespeare">
  <a href="example.pdf"><img src="example"/></a>
  </li> 

  <li class="johngreen">
  <a href="example.pdf"><img src="example"/></a>
  </li>

所以当我做了一些像Sortbyauthorjohngreen这样的事情时，它起了作用，但是当作者的数量达到8-9，有10-12本书时，代码的数量变得非常重复和长，加上图像的排列变得奇怪

因此，如果有人能指导我如何制作一个排序程序，那将是非常有帮助的。在对DOM的工作原理进行了一些实践之后，我计划学习jQuery，因此如果排序之类的事情需要jQuery，那么我将等到我学会它

---

抱歉，如果我在错误的论坛或其他地方发布了这篇文章，这是我的第一篇文章…

单击“运行代码片段”，然后单击“排序”

函数排序{ //抓住所有的lis var lis=document.getElementsByTagName'li'； //制作一个数组，将每个作者放入其中 var=[]； //每过一关

---

对于i＝0；您的代码似乎没有排序，而是隐藏和显示。要排序，您可以考虑创建具有引用相关LI的属性的对象，加上要排序的值。将对象放在一个数组中。使用您想要使用的任何值对数组进行排序，然后在适当的范围内迭代数组。order to re–对DOM元素进行排序。@RobG，非常感谢你的回答。是的，它只是隐藏和显示，因为我不知道如何排序。在我进一步练习使用DOM后，我将遵循你的答案。