https://www.layui.com/laydate/说明：下载 — laydate文件copy —放在你的项目文件下 — 引入laydate.js(它是采用原生的js去写的，不依赖于任何第三方的库的，兼容到ie8往上)
    https://www.layui.com/doc/中的内置模块—>日期与时间选择

    1. <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
    2.         integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    3.     <title></title>
    4. </head>
    6. <body>
    7.     <!-- 
    8.         https://www.layui.com/laydate/
    9.      -->
    11.     <div class="container">
    12.         <div class="row mt-5">
    13.             <div class="col">
    14.                 <div class="form-group form-inline">  form-inline横着排列
    15.                     <label for="date">日期：</label>
    16.                     <div type="text" class="form-control w-50" placeholder="请选择日期" id="date"></div>m-50百分之50
    17.                 </div>
    18.             </div>
    19.         </div>
    20.     </div>
    22.     <script src="laydate/laydate.js"></script>
    23.     <script>
    24.         var layDemo=laydate.render({    //初始化方法
    25.             //绑定元素
    26.             elem: '#date',  或者dom对象：document.getElementById('date')
    28.             //控件选择类型
    29.             type: 'year',只提供年列表的选择
    30.             type: 'month', 年月
    31.             type: 'date',  年月日
    32.             type: 'time',  时分秒
    33.             type: 'datetime', 年月日时分秒
    35.             //开启左右面板范围选择
    36.             //range:'*'字符串表示分隔符，表示开启范围，中间用这个字符串来做分隔符   
    37.                         默认值是false，
    38.                         true的时候，就是开启两个面板，显示两个日期选择固定范围的日期  input框中就是显示两个范围的日期
    39.                         可以通过type相结合进行
    41.             //自定义格式
    42.             format: 'yyyy-MM-dd HH:mm:ss',
    43.             format: 'yyyy年MM月dd日 HH时mm分ss秒',
    44.             format: 'yyyyMMdd',
    45.             format: 'dd/MM/yyyy',
    46.             format: 'yyyy年M月',
    47.             format: 'M月d日',
    48.             format: '北京时间：HH点mm分',
    49.             format: 'yyyy年的M月某天晚上，大概H点',
    50.             format: '亲，还记得yyyy年的M月d号那一天么？',
    51.             format: 'yyyy-MM-dd',
    53.             //初始值
    54.             /* value:'2008-08-08', 这个不OK
    55.             value:new Date(2008,7,8),
    56.             isInitValue :false,  意义不大*/
    58.             //最小/大范围内的日期时间值  字符串 || 数字
    59.             /* min: '2019-1-1',
    60.             max: '2019-12-31',
    62.             min: '2019-12-11 12:30:00',
    63.             max: '2019-12-18 12:30:00',时分秒必须用冒号：
    65.             min: -7,  左一周 
    66.             max: 7,   右一周
    68.             min: '09:30:00',  定义的时间，就是默认的是今天的日期
    69.             max: '17:30:00', */
    71.             //自定义弹出控件的事件
    72.             trigger :'focus',  获取到input焦点的时候这个提起框就弹出来了
    73.     如果绑定的时间不是input，那么默认的事件是click
    75.             //默认显示
    76.             show:false,
    78.             //定位方式
    79.             position:'abolute','fixed':就是应用到的是弹出层，
    80.                         'static':它可以把我们的组件放在一个对应的一个元素当中。用的不多
    83.             //层叠顺序
    84.             zIndex:66666666,
    86.             //是否显示底部栏
    87.             showBottom :true,
    89.             //工具按钮
    90.             btns :['now', 'clear',  'confirm'],里面可以删除，可以不填，可以都填 就是下方的按钮是否显示
    92.             //语言
    93.             lang:'cn',  'en'英文
    95.             //主题
    96.             theme :'default',默认值 绿色
    97.             theme :'molv',墨绿色
    98.             theme :'#f00',颜色值  16进制  
    99.             theme :'grid',方格主题
    100.             theme :'kaivon', 添加一个class  laydate-theme-kaivon
    102.             // 是否显示公历节日
    103.             calendar:true,里面的中国传统的节日
    105.             //标注重要日子
    106.             mark :{
    107.                 '0-5-3':'生日', 5月3号 生日
    108.                 '0-9-1':'开学', 9月1号 开学
    109.                 '0-0-10':'工资', 每月10工资
    110.                 '2019-12-6':'入职',这个2019年12月6号入职
    111.             },
    113.             //方法
    114.             //控件初始打开的触发这个回调
    115.             ready:function(date){
    116.                 console.log(date);当前日期年月日
    117.             },
    120.             //日期时间被切换后的回调
    121.             change:function(value,date,endDate){
    122.                 console.log(value);生成的值  就是显示的字符串 选择到的时间
    123.                 console.log(date);日期的时间对象   打开range 开始时间对象
    124.                 console.log(endDate);结束的日期的时间对象  打开range  结束事件对象
    126.                 layDemo.hint(value);  就是说实例的继承对象，我们自己声明的变量（对象继承了）的方法
    127.             },
    129.             //控件选择完毕后的回调
    130.             done:function(value,date,endDate){当我们点击确定的时候这个控件就会触发
    131.                 console.log(value);
    132.                 console.log(date);
    133.                 console.log(endDate);
    134.             },
    135.         });
    137.         console.log(layDemo);
    139.         var endDay=laydate.getEndDate();取到某一个月的最后一天  不给值的话就是默认today的日期
    140.         var endDay=laydate.getEndDate(2,2035);
    141. 获取这个月的总共天数的方法，我们平时就可以通过setdate（）设置一个日期对象，
    142. 我们把这个对象设置成一个setDate（2019，1，32），这个是可以执行的，这时候会变成下一个月的第一天，
    143. setDate（2019,1,0）这时候天数是没有零值的，会设置成上一个月的最后一天，这时候就出现最后一天了，
    144. 我们通过getDate（）就可以取到那一个月的天数了。我们平时方法的原理。这里面也是有一个坑就是月份的问题。
    146.         console.log(endDay);
    147.     </script>