canvas 绘制日历

最新推荐文章于 2024-04-10 18:30:51 发布

理个以哈呦

最新推荐文章于 2024-04-10 18:30:51 发布

阅读量521

点赞数

分类专栏： js 文章标签： javascript

本文链接：https://blog.csdn.net/qq_15253407/article/details/109622694

版权

在这里插入图片描述

/// index.html
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body,
        html {
   
            padding: 0;
            margin: 0;
            text-align: center;
        }
        
        .ctrl {
   
            text-align: center;
        }
        
        .ctrl:nth-child(1) {
   
            margin: 10px 10px;
        }
    </style>
</head>

<body>
    <section class="ctrl" id="btnCtrl">
        <button role="pre">上</button>
        <button role="current">当前</button>
        <button role="next">下</button>
    </section>
    <section class="ctrl">
        <span id="date-name"></span>
    </section>
    <canvas id="myCanvas"></canvas>
    <script src="./index.js"></script>
</body>

</html>

// index.js
window.onload = () => {
    
    let current_date = new Date();
    document.getElementById('btnCtrl').addEventListener('click', (e) => {
    
        let exe = {
   
            next: ()=> {
    
                console.log('1')
                current_date.setMonth(current_date.getMonth() + 1, 1);
                renderTable(current_date);
            },
            current: ()=> {
    
                renderTable(new Date());
            },
            pre: ()=> {
    
                current_date.setMonth

最低0.47元/天解锁文章

理个以哈呦

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
canvas 绘制日历

/// index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> bo
复制链接

扫一扫