JS小功能(setInterval实现图片效果显示时间)实例代码

 更新时间:2013年11月28日 15:28:52   作者:  
这篇文章主要介绍了setInterval实现图片效果显示时间实例代码,有需要的朋友可以参考一下

效果:

代码:

复制代码 代码如下:

<head runat="server">
    <title></title>
    <script type="text/javascript">
        function toDou(n) {
            if (n < 10) {
                return '0' + n;
            }
            else {
                return '' + n;
            }
        }
        setInterval(
        window.onload = function () {
            var aImg = document.getElementsByTagName('img');
            var oDate = new Date();
            var str = toDou(oDate.getHours()) + toDou(oDate.getMinutes()) + toDou(oDate.getSeconds());
            for (var i = 0; i < str.length; i++) {
                aImg[i].src = 'Images/Number1/' + str[i] + '.jpg';
            }
        }, 1000);

    </script>
</head>
<body style="background-color: Black;">
    <div style="text-align: center; line-height: 600px">
        <img src="Images/Number1/0.jpg" /><img src="Images/Number1/0.jpg" /><span style="font-size: 77px;
            color: White; text-align: center; line-height: 2px;">:</span><img src="Images/Number1/0.jpg" /><img
                src="Images/Number1/0.jpg" /><span style="font-size: 77px; color: White;">:</span><img
                    src="Images/Number1/0.jpg" /><img src="Images/Number1/0.jpg" />
    </div>
</body>

相关文章

  • Javascript封装id、class与元素选择器方法示例

    Javascript封装id、class与元素选择器方法示例

    这篇文章主要给大家介绍了Javascript封装id、class与元素选择器的方法,文中给出了详细的示例代码,对大家的理解和学习具有一定的参考价值,需要的朋友们下面来一起看看吧。
    2017-03-03
  • 前端js实现文件的断点续传 后端PHP文件接收

    前端js实现文件的断点续传 后端PHP文件接收

    这篇文章主要为大家详细介绍了断点续传的简单例子,前端文件提交,后端PHP文件接收,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-10-10
  • 微信小程序实现点击图片放大预览

    微信小程序实现点击图片放大预览

    这篇文章主要为大家详细介绍了小程序实现点击图片放大预览功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-10-10
  • JS实现深拷贝的几种简单方法示例

    JS实现深拷贝的几种简单方法示例

    深拷贝和浅拷贝是在JavaScript中复制对象或数组时经常遇到的概念,下面这篇文章主要给大家介绍了关于JS实现深拷贝的几种简单方法,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2023-10-10
  • JavaScript中Array.from()的超全用法详解

    JavaScript中Array.from()的超全用法详解

    Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括 ES6 新增的数据结构 Set 和 Map),别忘记就来讲讲他的具体用法吧
    2023-03-03
  • ES6入门教程之Iterator与for...of循环详解

    ES6入门教程之Iterator与for...of循环详解

    最近在学习ES6,刚刚看到Iterator和for...of循环这一章,所以想要跟大家略微分享一下,下面这篇文章主要给大家介绍了关于ES6入门学习中Iterator与for...of循环的相关资料,不足之处还望大家多多指正,需要的朋友们可以参考学习。
    2017-05-05
  • js的OOP继承实现(必看篇)

    js的OOP继承实现(必看篇)

    下面小编就为大家带来一篇js的OOP继承实现(必看篇)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-02-02
  • readonly和disabled的区别

    readonly和disabled的区别

    要慎用readonly和disabled, 指定了disabled的表单,在submit时,不会把它的值传出去, 如下所示,有两个text,一个是readonly一个是disabled,submit后,只能发送那个不是disabled的,注意地址栏的值. 要保存到本地,因为submit了,不然,看不到效果.
    2008-04-04
  • js opener的使用详解

    js opener的使用详解

    在JS中,window.opener只是对弹出窗口的母窗口的一个引用。本篇文章主要是对js中opener的使用进行了详细介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2014-01-01
  • js前端存储之sessionStorage使用方法举例

    js前端存储之sessionStorage使用方法举例

    sessionStorage是指本地存储一个会话中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁,这篇文章主要给大家介绍了关于js前端存储之sessionStorage使用方法的相关资料,需要的朋友可以参考下
    2024-06-06

最新评论