2021-06-10

最新推荐文章于 2022-02-14 09:25:29 发布

weixin_58811914

最新推荐文章于 2022-02-14 09:25:29 发布

阅读量151

点赞数

本文链接：https://blog.csdn.net/weixin_58811914/article/details/117785221

版权

JS实现输入日期计算该日期是当年的第几天

代码实现：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>指定日期</title>
</head>
<body>
    
<center> 
    <button id="btn">点我计算指定日期呀！</button>
</center>
   
    <script type="text/javascript">
        var btn=document.getElementById("btn");
        btn.onclick=function(){
           
            var year =parseInt(prompt("请输入年份："));
            var month = parseInt(prompt("请输入月份："));
            var day =parseInt(prompt("请输入日期："));
    
            var getMonth=new Array(31,28,31,30,31,30,31,31,30,31,30);
            var sum=0;
            for(var i=0;i < month-1;i++){
                sum+=getMonth[i];
                }
        
            if(( year%400 ==0||(year % 4 == 0&& year%100 !=0))&& month > 2){
                result=sum + day +1;
                document.write("该天为一年中的第" + result+ "天!");
            }
            else{
                result=sum+day;
                document.write("该天为一年中的第"+ result + "天!");
            }   
        } 
    </script>
</body>
</html>

HTML、CSS、JS实现随机点名器

代码实现：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>随机点名器</title>
  <style>
    *{
          margin:0;
          padding:0;
      }

      #main_div{
          margin:100px;
          background:rgba(162, 212, 212, 0.5);
          width:400px;
          padding:50px;
          border-radius:15px 15px 15px 15px;
          box-shadow:0 2px 12px #666666;
      }

      #box_div{
          margin:50px;
          padding:20px;
          width: 250px;
          font-size:40px;
      }

      #btn{
          color:red;
          width:110px;
          font-size:20px;
          border-color: gainsboro;
          background-color:rgba(225, 247, 225, 0.4);
          border-radius:8px 8px 8px 8px;
          box-shadow:0 2px 12px #797878;
          cursor:pointer;
          padding:5px;
      }
  </style>

 </head>
  <body>
      <center>
          <div id="main_div">
              <div id="box_div" >开始点名</div>
              <button id="btn" onclick="doit()">start</button>
          </div>
      </center>
      
      <script>
          var namelist=["张华","黎明","赵蕾蕾","李铭","王力","赵小云","吴倩丽","李芸芸","肖大力","吕莉","杨桦"];
          var bt = document.getElementById('btn');
          var box = document.getElementById('box_div');
          var timer;
          var flag =1;
            //点击开始按钮
          function doit(){
            if(flag){
              start();
              bt.innerText="stop";
              flag = 0;
            }else{
              stop();
              bt.innerText="start";
              flag = 1;
            }
          }
          //点击开始后开始做的事 设置定时任务随机抽取学生
          function start(){
            timer = setInterval(function(){
              var num = random(0,namelist.length);
              box.innerText = namelist[num];
            },100)
          }
          function stop (){
             clearInterval(timer);
          }
          function random(a,b){
             return parseInt(Math.random() * (b - a) + a);
          }
      </script>
        
</body>
</html>

weixin_58811914

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2021-06-10

代码实现：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <titl
复制链接

扫一扫