`

网页时钟的实现方式

    博客分类:
  • js
阅读更多

setInterval()是Window对象的方法,调用此方法来按照指定的周期(以毫秒计)来调用函数或计算表达式。

var dayarray=new Array("星期天","星期一","星期二","星期三","星期四","星期五","星期六");
   var montharray=new Array("1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月");
   
   function getthedate(){
    var mydate=new Date()
    var year=mydate.getYear()
    if (year < 1000) {
     year+=1900
    }
    var day=mydate.getDay()
    var month=mydate.getMonth()
    var daym=mydate.getDate()
    if (daym<10) {
     daym="0"+daym
    }
    var hours=mydate.getHours()
    var minutes=mydate.getMinutes()
    var seconds=mydate.getSeconds()
    var dn="AM"
   
    if (hours>=12) { dn="PM" }
    if (hours>23) { hours=0 }
    if (hours<=9) { hours="0"+hours }
    if (minutes<=9) { minutes="0"+minutes }
    if (seconds<=9) { seconds="0"+seconds }
   
    //change font size here
    var cdate = year+"年"+montharray[month]+daym+"日&nbsp;"+hours+":"+minutes+":"+seconds;
   
    if (document.all) {
     document.all.clock.innerHTML=cdate
    } else if (document.getElementByIdx) {
     document.getElementByIdx("clock").innerHTML=cdate
    } else {
     document.write(cdate)
    }
   }
   if (!document.all&&!document.getElementByIdx) {
    getthedate()
   }
   
   function showDate() {
    if (document.all||document.getElementByIdx) {
     setInterval("getthedate()",1000)
    }
   }

分享到:
评论

相关推荐

    javascript实现炫酷的网页版时钟

    这款炫酷的网页时钟是通过JavaScript技术实现的,为网页增添了一抹时尚和创意的色彩。时钟界面设计简洁美观,融合了令人惊艳的动态效果,为用户提供了一种全新的时间感知体验。 通过巧妙运用JavaScript编写的时钟...

    网页实现的时钟

    总结起来,这个项目是一个完整的前端开发实例,展示了HTML、CSS和JavaScript如何协同工作,实现动态的网页时钟。通过学习和实践这样的项目,开发者可以提升自己在网页交互设计和实时数据更新方面的技能,这对于任何...

    网页时钟:HTML+CSS+JS

    网页时钟是一个常见的编程练习,它利用HTML、CSS和JavaScript技术来实现在网页上显示实时时间的功能。这个项目是作者的学习成果,通过分享并期待他人的反馈,促进共同进步。 HTML(HyperText Markup Language)是...

    用Java实现的网页版电子时钟

    【Java实现的网页版电子时钟】 在网页中嵌入电子时钟是一项常见的需求,而Java Applet是一种能够在浏览器环境中运行的小型Java程序,非常适合用于此类任务。本项目利用Java编程语言,结合Applet技术,创建了一个...

    js实现网页时钟

    试用Javascript写的网页时钟程序,程序简单,代码浅显易懂,可套用

    可定时的网页时钟 HTML+JavaScript

    每种时钟的实现方式可能略有不同,但基本思路都是基于HTML和JavaScript的结合。开发者可以根据需求选择合适的样式,或者将这些样式作为灵感来源,开发出更个性化的时钟设计。 5. **跨浏览器兼容性** 考虑到不同的...

    网页时钟代码

    综上所述,这段网页时钟代码不仅展示了如何使用HTML和CSS构建网页的基本结构,还深入介绍了JavaScript如何与HTML交互,实现动态功能,如定时更新时钟显示。这对于学习前端开发、理解和实践动态网页设计具有很高的...

    HTML网页数字时钟代码.zip

    总的来说,这个项目结合了HTML、CSS和JavaScript,利用Vue.js框架实现了一个动态的网页数字时钟。对于学习Vue.js的开发者来说,这是一个很好的实践项目,能够深入理解Vue的数据绑定、组件化和响应式更新机制。同时,...

    css3实现网页电子时钟代码.zip

    总结来说,"css3实现网页电子时钟代码.zip" 是一个结合了JavaScript和CSS3技术的实例,展示了如何利用这两种语言创建一个实时更新、动态展示时间的网页时钟。通过学习和实践这个代码,开发者可以提升在网页动态效果...

    网上看到的用网页时钟

    8. JavaScript库和框架:虽然可以使用原生JavaScript实现网页时钟,但有时开发者会选择使用像jQuery这样的库或React这样的前端框架,以简化DOM操作和事件处理。 综上所述,制作一个“网上看到的用网页时钟”涉及到...

    VS2012下的简易网页时钟制作

    总的来说,这个"VS2012下的简易网页时钟制作"项目是一个很好的实践,它涵盖了网页开发的基础知识,并提供了一个实际的应用场景。通过学习和实践这个项目,初学者可以对HTML、CSS和JavaScript有更深入的理解,并掌握...

    网页版翻页时钟.zip

    网页版翻页时钟是一个基于JavaScript(js)和HTML(html)技术实现的互动时钟应用。这个项目是一个源代码示例...通过学习和探索这个项目,开发者不仅可以提升自己的编程技能,还能深入了解Web页面动态效果的实现方式。

    css3实现网页电子时钟效果

    【CSS3实现网页电子时钟效果】是一种利用CSS3的新特性来创建动态、实时更新的网页时钟的技术。CSS3是层叠样式表(Cascading Style Sheets)的第三个主要版本,它引入了许多新的功能和选择器,使得网页设计变得更加...

    JS+CSS3圆形时钟走动特效网页设计,html+css3模拟时钟走动

    JS+CSS3圆形时钟走动特效网页设计,html+css3模拟时钟走动,纯静态网页实现; 主要是用了transform属性,定时器setInterval动态改变旋转角度来达到时钟动态效果,源码分离了css、js和html,总共分为三个文件; 主要...

    翻页时钟网页版(精美多功能翻页时钟源码)

    翻页时钟网页版是一种独特的数字时钟设计,它模拟了传统机械翻页钟的显示方式,每到整点或半点,时钟的数字会像真实的翻页一样逐个翻转,为网页增添了生动有趣的视觉效果。这种设计通常采用HTML、CSS和JavaScript等...

    网页特效-时钟日历篇

    本资源“网页特效-时钟日历篇”正好聚焦于这一主题,提供了可能包括JavaScript实现的时钟和日历组件。 JavaScript是一种广泛用于网页动态效果的编程语言,它可以赋予网页交互性和实时性。在这个资源中,我们可能会...

    flash透明时钟140个

    本文将探讨一个包含140个Flash透明时钟的资源集合,这些透明时钟对于美化网页设计来说具有不可小觑的价值。 首先,Flash透明时钟的魅力在于其独特的视觉效果。透明背景的设计让时钟可以轻易地融入各种网页布局,而...

    动态时钟_动态时钟_网页版时钟_sceneafx_

    动态时钟的概念意味着时钟的显示方式并非静态,而是有某种形式的动态效果,比如指针旋转、数字跳跃等,这可以增加用户的互动体验和视觉吸引力。 从标签“动态时钟 网页版时钟 sceneafx”我们可以进一步理解,这个...

    翻页时钟网页版.rar

    【标题】"翻页时钟网页版....总的来说,这个项目结合了Vue.js的技术特性,实现了网页版的翻页时钟,为用户带来一种新颖的时间显示方式。开发者可以通过研究源码,学习如何利用Vue.js实现动态效果和组件化的前端开发。

Global site tag (gtag.js) - Google Analytics