jQuery插件开发：系统时间插件

---

---

jQuery日期插件

---

jquery-timer-1.0.min.js
runtime

(function($){
	/** 单个为jQuery添加对象方法 */
	$.prototype.test = function(){
	};
	/** 批量添加对象方法 */
	$.fn.extend({
		runtime : function(){
			/** 创建日期对象 */
			var d = new Date();
			/** 定义数组 */
			var res = new Array();
			/** 获取年 */
			res.push(d.getFullYear() + "年");
			/** 获取月 0-11 */
			res.push($.calc(d.getMonth() + 1) + "月");
			/** 获取日 */
			res.push($.calc(d.getDate()) + "日");
			/** 获取星期几(0星期日-6星期六) */
			res.push(" " + $.weeks[d.getDay()] + " ");
			/** 获取小时 */
			res.push($.calc(d.getHours()) + ":");
			/** 获取分 */
			res.push($.calc(d.getMinutes()) + ":");
			/** 获取秒 */
			res.push($.calc(d.getSeconds()));
			
			this.html(res.join(""));
			
			var t = this; // this : 当前jQuery对象
			
			window.setTimeout(function(){
				// this == window
				t.runtime();
			}, 1000);
		}
	});
	/** 添加静态方法 */
	$.weeks = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
	/** 用来计算不够两位前面补零 */
	$.calc = function(str){
		return str > 9 ? str : "0" + str;
	};
	
})(jQuery);

---

---

JSP页面

	<!-- 引用jQuery -->
	<script type="text/javascript" src="${path}/js/jquery-1.11.3.min.js"></script>
	<script type="text/javascript" src="${path}/js/jquery-migrate-1.2.1.min.js"></script>
	<!-- 引入自己开的时期插件 -->
	<script type="text/javascript" src="${path}/js/jquery-timer-1.0.min.js"></script>
	
	<script type="text/javascript">
		$(function(){
			/** 显示当前系统时间 */
			$("#time").runtime();
	</script>

<span style="font-size:14px;" id="time" style="color:#fff;"></span>

---

---

页面效果

2020年02月20日 星期四 20：20：00