lovecoding
/
Web1020


			
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
							<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <ul id="box">
        <!-- <li>2025年1月19日</li> -->
    </ul>
    <script>
        /*
        题目：使用 HTML 和 JavaScript 使用 map 方法将数组中的每个月份变为正常的月数，并将结果显示在页面上。
             其中月份为默认值是0-11，需要转换为正常月份。
        要求：
            使用js在 HTML 中创建<li> 元素，用于显示结果。
            要求页面显示样式为：xxxx年xx月xx日。
            使用 JavaScript 的 map 方法对数组进行操作。
            可用 css/js 为列表项添加样式，如设置字体大小、颜色等。
        */
        let arr = ["2025-1-1", "2025-2-1", "2025-3-1", "2025-4-1", "2025-5-1", "2025-6-1", "2025-7-1", "2025-8-1", "2025-9-1", "2025-10-1", "2025-11-1", "2025-0-1"];

        //格式化数据
        function formatData(str) {
            // 2025-1-1 将字符型的日期分割成数组
            let resDate = str.split("-"); 
            let year = resDate[0];
            let month = Number.parseInt(resDate[1])+1;
            let day = resDate[2];
            let dateStr = `${year}年${month}月${day}日`;
            return dateStr;
            // 2025年2月1日
        }

        //将格式化后的数据添加到新数组中
        let resArr = arr.map(function (item) {
            return formatData(item);
        });


        // 将新格式化后的数据添加到页面中
        let oBox = document.getElementById("box");
        resArr.forEach(function (item, index) {
            let oLi = document.createElement("li");
            oLi.innerText = item;
            oBox.appendChild(oLi);
        });


    </script>
</body>

</html>