CMS建站，该如何通过js实现1-12月份的排序，而且判断当前月排在首位

继上次 [html如何实现让1-12月根据当前月份进行排序？] 的提问(https://segmentfault.com/q/1010000043625688)，通过好几个小时的研究终于达到了自己想要的效果。
我就是个小白，对于大神而言，可能这篇文章并没啥含金量，但如果能办到一小部分的人，那么来说也算是功德无量了。
首先，说说我前期的需求：
近期自己在做一个旅游小站，就像实现一个功能，根据不同的月份给用户推荐最适合出游的城市或者是景点。
如：5月份，最适合去北京；6月份最适合去西藏；7月份最适合去湖南等等；
如果现在是5月份，那么5月的和5月份的内容需要排在最前面，其他月份依次往后排序。
捣鼓了好久，因为没有后台，网站又是使用cms程序制作的，数据只能通过特定的标签来进行获取。
如果有api接口，那么都好说，直接通过接口进行获取数据即可。
先看html代码

<div class="qyq_MonthBox">
    <ul class="month_list"></ul>
</div>
<div class="qyq_MonthlyBox">
    <div class="qyq_Monthly"></div>
</div>

month_list和qyq_Monthly里面会通过js代码自动渲染出内容，后面js代码会看到。

一开始，我打算直接将1-12月份的html代码写出来，可不好做判断，我不知道是我的思路没对还是咋滴，反正我是没想明白。
尝试了好多方法，没成功。
因为月份是通过js整出来的，而且month_list下面的li标签都还有tab选项卡功能，反正就是我没搞出来。
后面，我让qyq_Monthly里面的内容需要对应month_list下面的月份，两者进行了监听绑定，说实话我也不知道是不是叫监听，反正我就是要它俩给我的数据实现统一。
【注意：这个需要再cms后台单独建立1-12月份的栏目，便于每个月份对应每个月份不同的内容。】
下面看js代码......

// 获取当前月份
        const currentMonth = new Date().getMonth() + 1;
      
        // 创建月份数组
        const months = [
          { value: 1, name: "1月" },
          { value: 2, name: "2月" },
          { value: 3, name: "3月" },
          { value: 4, name: "4月" },
          { value: 5, name: "5月" },
          { value: 6, name: "6月" },
          { value: 7, name: "7月" },
          { value: 8, name: "8月" },
          { value: 9, name: "9月" },
          { value: 10, name: "10月" },
          { value: 11, name: "11月" },
          { value: 12, name: "12月" }
        ];
      
        // 将月份数组按照当前月份排序
        const sortedMonths = months.slice(currentMonth - 1).concat(months.slice(0, currentMonth - 1));
      
        // 在页面中展示月份列表
        const monthList = document.querySelector(".month_list");
        sortedMonths.forEach((month) => {
          const listItem = document.createElement("li");
          listItem.textContent = month.name;
          if (month.value === currentMonth) {
            listItem.classList.add("current-month");
          }
          monthList.appendChild(listItem);
        });
      
        // 定义每个月份的内容
        const contents = {
        1: `
            <div class="card">
            <h3>这是 1 月的标题</h3>
            <img src="/template/qyqtrip/mobile/skin/assets/images/pic/pic_sw05.png">
            </div>
        `,
        2: `
            <div class="card">
            <h3>这是 2 月的标题</h3>
            <img src="/template/qyqtrip/mobile/skin/assets/images/pic/pic_sw05.png">
            </div>
        `,
        3: `
            <div class="card">
            <h3>这是 3 月的标题</h3>
            <img src="/template/qyqtrip/mobile/skin/assets/images/pic/pic_sw05.png">
            </div>
        `,
        4: `
            <div class="card">
            <h3>这是 4 月的标题</h3>
            <img src="/template/qyqtrip/mobile/skin/assets/images/pic/pic_sw05.png">
            </div>
        `,
        5: `
            {eyou:artlist loop="5"  typeid=""  titlelen="255"  infolen="25" }
            <div class="card">
            <h3>{$field.title}</h3>
            <img src="{$field.litpic}">
            </div>
            {/eyou:artlist}
        `,
        6: `
            <div class="card">
            <h3>这是 6 月的标题</h3>
            <img src="/template/qyqtrip/mobile/skin/assets/images/pic/pic_sw05.png">
            </div>
        `,
        7: `
            <div class="card">
            <h3>这是 7 月的标题</h3>
            <img src="/template/qyqtrip/mobile/skin/assets/images/pic/pic_sw05.png">
            </div>
        `,
        8: `
            <div class="card">
            <h3>这是 8 月的标题</h3>
            <img src="/template/qyqtrip/mobile/skin/assets/images/pic/pic_sw05.png">
            </div>
        `,
        9: `
            <div class="card">
            <h3>这是 9 月的标题</h3>
            <img src="/template/qyqtrip/mobile/skin/assets/images/pic/pic_sw05.png">
            </div>
        `,
        10: `
            <div class="card">
            <h3>这是 10 月的标题</h3>
            <img src="/template/qyqtrip/mobile/skin/assets/images/pic/pic_sw05.png">
            </div>
        `,
        11: `
            <div class="card">
            <h3>这是 11 月的标题</h3>
            <img src="/template/qyqtrip/mobile/skin/assets/images/pic/pic_sw05.png">
            </div>
        `,
        12: `
            <div class="card">
            <h3>这是 12 月的标题</h3>
            <img src="/template/qyqtrip/mobile/skin/assets/images/pic/pic_sw05.png">
            </div>
        `
        };

        // 在页面中展示月份内容
        const monthlyContainer = document.querySelector(".qyq_Monthly");
        sortedMonths.forEach((month) => {
        const monthlyItem = document.createElement("div");
        monthlyItem.classList.add("qyq_Monthly_item");
        monthlyItem.textContent = month.value;
        
        const content = document.createElement("div");
        content.innerHTML = contents[month.value];
        monthlyItem.appendChild(content);
        
        monthlyContainer.appendChild(monthlyItem);
        });
      
        // 绑定点击事件，切换月份内容
        const monthItems = document.querySelectorAll(".month_list li");
        const monthlyItems = document.querySelectorAll(".qyq_Monthly_item");
        monthItems.forEach((item, index) => {
          item.addEventListener("click", () => {
            // 切换当前月份样式
            monthItems.forEach((item) =>
              item.classList.remove("current-month")
            );
            item.classList.add("current-month");
      
            // 切换 qyq_Monthly_item 显示
            monthlyItems.forEach((item, i) => {
              if (i === index) {
                item.classList.add("show");
                item.classList.remove("hide");
              } else {
                item.classList.add("hide");
                item.classList.remove("show");
              }
            });
          });
        });
      
        // 页面加载完成时，默认显示当前月份的内容
        window.addEventListener("load", () => {
          const defaultIndex = sortedMonths.findIndex(
            (month) => month.value === currentMonth
          );
          monthItems[defaultIndex].click();
        });

const contents =这个里面就是每个月份对应不同的内容，

{eyou:artlist loop="5"  typeid=""  titlelen="255"  infolen="25" }
    <div class="card">
        <h3>{$field.title}</h3>
        <img src="{$field.litpic}">
    </div>
{/eyou:artlist}

上面这个是自定义的cms获取内容的标签。
如此操作，那么就实现了我想要的效果，当下是5月，效果就是5月排在了第一个，后面依次排序其他的月份，当前展示的也是5月份的内容。

对于代码而言，可能我有很多方面表达的并不是很正确，但目前实现了我想要的功能我认为就是可以的。也欢迎大家批评指正，也可以大家一起来讨论，或者你还有什么更好的方法能够实现我当下所处环境的效果，评论区见。