zoukankan      html  css  js  c++  java
  • 3、Data对象

    1、创建part1.html

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     2 <html xmlns="http://www.w3.org/1999/xhtml">
     3 <head>
     4 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
     5 <title>Date对象的使用-时钟特效</title>
     6 <script type="text/javascript">
     7 window.onload=function(){
     8   //获取第一个input标签
     9    var inputone=document.getElementsByTagName("input")[0];
    10    
    11    //给input标签添加点击事件
    12    inputone.onclick=function(){
    13      setTimeout("timeFun()",2000);
    14    }
    15    
    16    //获取第2个input标签
    17    var inputtwo=document.getElementsByTagName("input")[1];
    18    
    19    //给input标签添加点击事件
    20   var timestr;
    21    inputtwo.onclick=function(){
    22      timestr=setInterval("timeFun()",1000);
    23    }
    24    
    25     //获取第2个input标签
    26    var inputthree=document.getElementsByTagName("input")[2];
    27    
    28    //给input标签添加点击事件
    29    inputthree.onclick=function(){
    30       clearInterval(timestr);
    31    }
    32 
    33 }
    34 
    35 function timeFun(){
    36    var date=new Date();
    37    var year=date.getFullYear(); //获取四位年份
    38    var month=date.getMonth()+1; //月份
    39    var day =date.getDate(); //一个月中某一天,范围1-31
    40    var week=date.getDay(); //星期
    41    var hour=date.getHours(); //小时数,24进制
    42    var minutes=date.getMinutes(); //分钟
    43    var second=date.getSeconds();  //
    44    var time=year+""
    45            +month+""
    46            +day+"日  星期"+week+"  "
    47            +hour+""+minutes+""+second+""; 
    48         console.log(time);
    49    document.getElementsByTagName("div")[0].innerHTML=time;
    50   
    51    
    52 }
    53 </script>
    54 </head>
    55 
    56 <body>
    57 <input type="button" value="3秒后出现"/>
    58 <input type="button" value="动态时钟"/>
    59 <input type="button" value="停止时钟"/>
    60 <div id="time">
    61 </div>
    62 </body>
    63 </html>
    date对象实现时钟特效

    2、效果图

    3、点击“三秒后出现”

    4、点击动态时钟

    5、点击停止时钟,时间将停止各秒刷新

  • 相关阅读:
    web自动化--如何在不同页面间游刃有余
    web自动化-窗口句柄及位置变化
    [bug] 验证selenium的显式和隐式等待而发现的一个低级错误
    Web自动化
    Appium 实战练习一
    Appium1.9 之 Chromedriver安装方式
    Appium1.9.1 之 Desired Capabilities 释疑
    [BUG]Appium1.9.1 这个问题竟然花了我5分钟进行定位
    Appium1.9.1 部署及结果检验
    selenium 初探
  • 原文地址:https://www.cnblogs.com/holly8/p/5578897.html
Copyright © 2011-2022 走看看