浏览器对象(BOM)---动态显示时间

浏览器对象(BOM)---动态显示时间
52jyhcc
52jyhcc
328
阅读
0
评论
2021年08月05日00:50:18 0 328

今天实践JavaScript(BOM)---动态显示时间:

话就不多说,源码放下面了,节省了时间,不用下载,Ctrl+C(复制)

主要用到:Date 对象:

Date 对象用于处理日期与时间。

reload() 方法:

reload()方法用于刷新当前文档。

getElementById() 方法:

可返回对拥有指定 ID 的第一个对象的引用。这个以后案例会讲和实践

还有一个讲过的setInterval()

方法:

嗯,如果忘记了,很正常,

学习过程中,就是不断学习后巩固的过程:

看这一章的案例,重温一遍吧:

浏览器对象(BOM)---定时器

杨shu,公众号:一颗剽悍的种子

浏览器对象(BOM)---定时器

<!DOCTYPE html>

<html>

  <head>

    <meta charset="utf-8">

    <title></title>

  </head>

  <body>

    <script>

  function click(){

    var today = new Date();

    var hours = today.getHours();

    var minutes = today.getMinutes();

    var seconds = today.getSeconds();

    var str = '现在的时间是——';

    if(hours <= 12){

      str += '上午:'

    }else{

      str += '下午:'

    }

    str += hours+'时'+minutes+'分'+seconds+'秒';

    var clock = document.getElementById('test');

    clock.value = str;

    }

     t = setInterval('click()',1000);

  function start(){

    location.reload();

  }

  function stop(){

    clearInterval(t);

  }

</script>

    <center>

    <input type = "text" id = "test"  size="35"/><br>

    <input type = "button"   value="开始" onclick = "start()"/><br>

    <input type = "button"   value="停止" onclick = "stop()"/>

    </center>

  </body>

</html>

《深入浅出JavaScript》最后说:

1.源码是完善的,可以运行的,但是不要只看,去敲一遍。

2.然后呢,再看一下这些代码的定义和方法。

3.学习编程是一个不断理解和运用的过程,直到你理解的深入,和运用得如鱼得水,那么编程就会是一门手艺了。

这门手艺也许让你烦躁又充满创造力的手艺


打赏 点赞(0)
weinxin
投诉&咨询
文章名+链接地址,发送到此微信:tourism52
历史上的今天
03月
27
flask,教程,简介 菜鸟教程

Flask教程1-简介

一、简介Flask是使用Python编写的Web微框架(microframework),Flask仅保留了Web框架的核心,其他的功能都交给扩展实现,如果没有合适的扩展,大家甚至可...
用JS写Windows计算器 菜鸟教程

用JS写Windows计算器

今天给大家分享下如何用JS写一个windows简易计算器,虽然电脑上都自带计算器,不过我们自己写一个简单的计算器实例,不仅可以用起来更方便,还可以提升写代码的乐趣,何乐而不为呢! ...
编程,基础, | ,html,简介 菜鸟教程

编程基础 | HTML简介

本期是一个大篇章——“渗透测试”的第一个部分:“编程基础”。一、什么是HTML称为超文本标记语言,是一种标识性语言。通过一系列标签可以将网络上的文档格式统一,使分散的Interne...

评论列表 共有 0 条评论

暂无评论