<html>

 <head>

 <title>JavaScript</title>

 <script language="javascript">

 function showtime(){

     var now_time = new Date() ;  // 创建时间对象

     var hours = now_time.getHours() ; //获得当前小时数

     var minutes = now_time.getMinutes() ; //获得当前分钟数

     var seconds = now_time.getSeconds() ; //获得当前秒数

     var timer = "" + ((hours > 12) ? hours - 12 : hours ) ; //将小时数值赋予变量timer

     timer += ((minutes < 10) ? ":0" : ":") + minutes ; //将分钟数值赋予变量timer

     timer += ((seconds < 10) ? ":0" : ":") + seconds ; //将秒数值赋予变量timer

     timer += " " + ((hours > 12) ? "pm" : "am") ; //将字符am或pm赋予变量timer

     document.clock.show.value = timer ; //在名为clock的表单中输出变量timer的值

     setTimeout("showtime()",1000) ; //设置每隔一秒钟自动调用一次showtime()函数

 }

 </script>

 </head>

 <body onload=showtime()>

 <form name="clock" onSubmit="0">

 <input type="text" name="show" size="10" style="background-color: lightyello;border-width:3;">

 </form>

 </body>

 </html>

javascript也是蛮好玩的啊！

以上为第一个JS小程序实现显示当前时间！

前端开发自学之JavaScript——显示当前时间的更多相关文章

  1. Web前端开发神器--WebStorm(JavaScript 开发工具) 8.0.3 中文汉化破解版

    WebStorm(JavaScript 开发工具) 8.0.3 中文汉化破解版 http://www.jb51.net/softs/171905.html WebStorm 是jetbrains公司旗 ...

  2. JavaScript显示当前时间的操作

    JavaScript一种直译式脚本语言,是一种动态类型.弱类型.基于原型的语言,内置支持类型.它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标 ...

  3. 《JavaScript &amp; jQuery交互式Web前端开发》之JavaScript基础指令

           在本节中.你将開始学习阅读和编写JavaScript代码,还将学习怎样编写Web浏览器可以遵照运行的指令.在開始学习后面章节中的更复杂的概念之前.我们先学习语言的一些核心部分,然后看看怎 ...

  4. web前端开发自学路线是怎样的？html+css+JavaScript的学习方法？

    不废话,直接干货 学习前端的几个个阶段: 一阶段:html标签.html5新增标签.css样式.css3样式.媒体查询等 二阶段:JavaScript.jQuery.ajax.面向对象.http传输协 ...

  5. 前端开发工程师 - 02.JavaScript程序设计 - 第2章.进阶篇

    第2章--进阶篇 类型进阶 类型: Undefined Null Boolean String Number Object 原始类型(值类型):undefined, null, true, " ...

  6. 前端开发工程师 - 02.JavaScript程序设计 - 第1章.基础篇

    第1章--基础篇 JS介绍 html 网页的内容:css 网页的样式:javascript 网页的行为 i.e. hello world <!DOCTYPE html> <html& ...

  7. javascript显示实时时间

    <html> <script language=Javascript> function time(){ //获得显示时间的div t_div = document.getEl ...

  8. python +Django 搭建web开发环境初步，显示当前时间

    1.python 的安装 网上很多关于django跟python 开发的资料,这块我正在实习准备用这个两个合起来搞一个基于web 的东西出来现在开始学习,写点东西记录一下心得. 开发环境是window ...

  9. javascript显示年月日时间代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. 使用http.sys，让delphi 的多层服务飞起来

    核心提示:一直以来,delphi 的网络通讯层都是以indy 为主,虽然indy 的功能非常多,涉及到网络服务的各个方面,但是对于大多数多层服务来说,就是需要一个快速.稳定.高效的传输层.Delphi ...

  2. Codeforces 696 C. PLEASE

    Description 三个杯子,一开始钥匙在中间,每次等概率的选择两边的两个,与中间的交换,问第 \(n\) 次选择中间的杯子是钥匙的概率是多少. \(n=\sum_{i=1}^{k} a_i,a_ ...

  3. Xtrabackup 安装使用

    一 简介:      Xtrabackup是一个对InnoDB做数据备份的工具,支持在线热备份(备份时不影响数据读写),是商业备份工具InnoDB Hotbackup的一个很好的替代品.它能对Inno ...

  4. Sublime 3 如何设置xftp 保存自动上传

    采用sublime SFTP插件,直接保存CentOS服务器的NodeJS文件,这样调试起来很方便,当然得配上 一直采用File  ->   SFTP/FTP  ->   Setup Se ...

  5. WINFORM中的COMBOX模糊查询

    有的时候下拉框中的元素过多不好查询,可以考虑进行模糊过滤查询. 在类文件的designer.cs中找到定义combox的模块,加入以下两行代码即可: this.combox.AutoCompleteM ...

  6. Blender使用基础

    快捷键 -- 鼠标放在“大纲视图” -- .(小键盘) 定位到所选对象(该键的英文为period) -- 鼠标放在“3D视图” -- n  打开3D视图右面属性面板(把鼠标放在面板上,按F5可以左右切 ...

  7. MongoDB学习笔记(1)：MongoDB简介

    1. MongoDB的特点: (1) 易于使用 MongoDB是一个面向文档的数据库,非关系型数据库.通过在文档中嵌入式文档和数据,面向对象的方法能够仅使用一条记录来表现复杂的层次关系.文档的键和值不 ...

  8. MIT 6.828 JOS学习笔记3. Exercise 1.2

    这篇博文是对Lab 1中的Exercise 2的解答~ Lab 1 Exercise 2: 使用GDB的'si'命令,去追踪ROM BIOS几条指令,并且试图去猜测,它是在做什么.但是不需要把每个细节 ...

  9. HTML 表

    表格: <table></table> 插入一个表格 <tr></tr> 代表一行 其中插入<td></td>单元格       ...

  10. 转：WCF、WebAPI、WCFREST、WebService之间的区别

    WCF.WebAPI.WCFREST.WebService之间的区别   注明:转载 在.net平台下,有大量的技术让你创建一个HTTP服务,像Web Service,WCF,现在又出了Web API ...