js实现某年某月某天距离现在有多少天,多少分,多少秒,动态显示!

本文主要是介绍js实现某年某月某天距离现在有多少天,多少分,多少秒,动态显示!，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

简单描述一下问题：给定一个年月日时分秒，在网页中动态显示，距离今天已经有多少天，多少小时，多少分钟，多少秒.

1.用到的这些jQuery和jscex文件都可以从网上下载，这里不再赘述

<script src=" jquery-1.11.1.min.js "></script>
<script type="text/javascript" src="jscex.min.js"></script>
<script type="text/javascript" src="jscex-parser.js"></script>
<script type="text/javascript" src="jscex-jit.js"></script>
<script type="text/javascript" src="jscex-builderbase.min.js"></script>
<script type="text/javascript" src="jscex-async.min.js"></script>
<script type="text/javascript" src="jscex-async-powerpack.min.js"></script>

2.这里还要引用一个.js文件，是自己写的，方便操作

<script type="text/javascript" src="functions.js" charset="utf-8"></script>

具体的内容如下：var $win = $(window);
var clientWidth = $win.width();
var clientHeight = $win.height();$(window).resize(function() {var newWidth = $win.width();var newHeight = $win.height();if (newWidth != clientWidth && newHeight != clientHeight) {location.replace(location);}
});(function($) {$.fn.typewriter = function() {this.each(function() {var $ele = $(this), str = $ele.html(), progress = 0;$ele.html('');var timer = setInterval(function() {var current = str.substr(progress, 1);if (current == '<') {progress = str.indexOf('>', progress) + 1;} else {progress++;}$ele.html(str.substring(0, progress) + (progress & 1 ? '_' : ''));if (progress >= str.length) {clearInterval(timer);}}, 75);});return this;};
})(jQuery);function timeElapse(date){var current = Date();var seconds = (Date.parse(current) - Date.parse(date)) / 1000;var days = Math.floor(seconds / (3600 * 24));seconds = seconds % (3600 * 24);var hours = Math.floor(seconds / 3600);if (hours < 10) {hours = "0" + hours;}seconds = seconds % 3600;var minutes = Math.floor(seconds / 60);if (minutes < 10) {minutes = "0" + minutes;}seconds = seconds % 60;if (seconds < 10) {seconds = "0" + seconds;}var result = "第 <span class=\"digit\">" + days + "</span> 天 <span class=\"digit\">" + hours + "</span> 小时 <span class=\"digit\">" + minutes + "</span> 分钟 <span class=\"digit\">" + seconds + "</span> 秒"; $("#clock").html(result);
}



3.不多说了，直接上完整代码，代码上有注释<body><div id="clock-box"> <span></span><font color="#33CC00">我们</font> <span>已经是……</span><div id="clock"></div></div></body><script src=" jquery-1.11.1.min.js "></script><script type="text/javascript" src="jscex.min.js"></script><script type="text/javascript" src="jscex-parser.js"></script><script type="text/javascript" src="jscex-jit.js"></script><script type="text/javascript" src="jscex-builderbase.min.js"></script><script type="text/javascript" src="jscex-async.min.js"></script><script type="text/javascript" src="jscex-async-powerpack.min.js"></script><script type="text/javascript" src="functions.js" charset="utf-8"></script><script>var textAnimate = eval(Jscex.compile("async", function () {var together = new Date();together.setFullYear(2014,10, 15); 			//时间年月日，注意月份是0-11together.setHours(0);						//小时	together.setMinutes(0);						//分钟together.setSeconds(0);						//秒前一位together.setMilliseconds(0);				//秒第二位$("#clock-box").fadeIn(500);while (true) {timeElapse(together);$await(Jscex.Async.sleep(1000));}}));textAnimate().start();</script>

4.希望大家有什么不懂得，可以直接查官方文档，穿"一手鞋"。

快乐学习，快乐编程!

这篇关于js实现某年某月某天距离现在有多少天,多少分,多少秒,动态显示!的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！