Web js时间戳转换

分手后的思念是犯贱 2022-11-17 14:38 205阅读 0赞

###                                                               Web js时间戳转换 ###

**一、简述**

记--时间转时间戳，时间戳转时间，年积日计算。

**二、效果**

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L25hbmZlaWJ1eWk_size_16_color_FFFFFF_t_70][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L25hbmZlaWJ1eWk_size_16_color_FFFFFF_t_70 1][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L25hbmZlaWJ1eWk_size_16_color_FFFFFF_t_70 2][]

**三、例子代码**

<!DOCTYPE html>
    <html>
    <head>
    	<meta content="text/html" charset="utf-8">
    	<title>时间戳转换</title>
    	<script type="text/javascript">
    		
    		/*获取当前时间并刷新*/
    		function RefreshDateTime() {
    			var now = new Date();
    			var element_current_timestamp = document.getElementById("current_timestamp");
    			if (undefined != element_current_timestamp && null != element_current_timestamp) {
    				element_current_timestamp.innerHTML = now.getTime()/1000;	
    			}
    
    			var element_current_localtime = document.getElementById("current_localtime");
    			if (undefined != element_current_localtime && null != element_current_localtime) {
    				element_current_localtime.innerHTML = FormatDate(now) + " (" + now.toLocaleString() + ")";	
    			}
    
    			var element_current_utctime = document.getElementById("current_utctime");
    			if (undefined != element_current_utctime && null != element_current_utctime) {
    				element_current_utctime.innerHTML = now.toUTCString();	
    			}
    						
    		}
    
    		/*格式化时间*/
    		function FormatDate(date) {
    			if (undefined == date || null == date || "" == date) {
    				return "";
    			}
    
    			var mon = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth(); //月
                var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate(); //日期
                var hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(); //时
                var min = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes(); //分
                var sec = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds(); //秒
                var datetime = date.getFullYear() + "-" + mon + "-" + day + " " + hour + ":" + min + ":" + sec;
    
                return datetime;
    		}
    
    		/*将时间戳转换为时间*/
    		function ConvertTimestamp () {
    			var timestamp_obj = document.getElementById("convert_timestamp");
    			if (undefined == timestamp_obj || null == timestamp_obj) {
    				console.log("not found element:convert_timestamp.");
    				return;
    			}
    
    			if ("" == timestamp_obj.value || null == timestamp_obj.value) {
    				console.log("convert_timestamp is empty.");
    				return;
    			}
    
    			var convert_timestamp_label_obj = document.getElementById("convert_timestamp_label");
    			if (undefined != convert_timestamp_label_obj && null != convert_timestamp_label_obj) {
    				convert_timestamp_label_obj.innerHTML = timestamp_obj.value;
    			}
    
    			var date = new Date(parseInt(timestamp_obj.value)*1000);
    			var element_convert_localtime = document.getElementById("convert_localtime");
    			if (undefined != element_convert_localtime && null != element_convert_localtime) {
    				element_convert_localtime.innerHTML =  FormatDate(date) + " (" + date.toLocaleString() + ")";	
    			}
    
    			var element_convert_utctime = document.getElementById("convert_utctime");
    			if (undefined != element_convert_utctime && null != element_convert_utctime) {
    				element_convert_utctime.innerHTML = date.toUTCString();	
    			}
    		}
    
    		/*初始化日历控件为当前时间*/
    		function InitCalendar() {
                var now = new Date();
                var mon = now.getMonth() + 1 < 10 ? "0" + (now.getMonth() + 1) : now.getMonth(); //月
                var day = now.getDate() < 10 ? "0" + now.getDate() : now.getDate(); //日期
                var hour = now.getHours() < 10 ? "0" + now.getHours() : now.getHours(); //时
                var min = now.getMinutes() < 10 ? "0" + now.getMinutes() : now.getMinutes(); //分
                var date = now.getFullYear() + "-" + mon + "-" + day;
                	
                if (undefined != document.getElementById("calendar_datetime")) {
                	var datetime = date + "T" + hour + ":" + min;
                	document.getElementById("calendar_datetime").value = datetime;
                }
    
                if (undefined != document.getElementById("calendar_date")) {
                	document.getElementById("calendar_date").value = date;
                }           
            }
    
            /*日期时间转时间戳*/
            function CalendarDateTimeToTimestamp() {
            	if (undefined != document.getElementById("calendar_datetime") && undefined != document.getElementById("calendar_timestamp")) {
                	var datetime = document.getElementById("calendar_datetime").value;
                	if (undefined != datetime && null != datetime && "" != datetime) {
                		var arr = datetime.split(/[-T:]/);
                		if (5 >= arr.length) {
                			var date = new Date();       			
                			date.setFullYear(arr[0]);
                			date.setMonth(arr[1]-1);
                			date.setDate(arr[2]);
                			date.setHours(arr[3]);
                			date.setMinutes(arr[4]);
                			date.setSeconds(0);
                			document.getElementById("calendar_timestamp").innerHTML = parseInt(date.getTime()/1000);
                		}
                	}
                } 
            }
    
            /*计算年积日*/
            function CalculateDayOfYear(date) {
            	if (undefined == date || null == date || "" == date) {
            		console.log("date is " + date);
            		return 0;
            	}
            	var year = date.getFullYear();
            	var mon = date.getMonth();
            	var day_of_year = 0;
            	var mon_days = new Array(31,28,31,30,31,30,31,31,30,31,30,31);
            	if( ( year%4 == 0 && year%100 !=0 ) || year%400==0) {
          			mon_days[1]= 29;
            	}
    
          		for(var i = 0; i < mon; i++) {
          			day_of_year += mon_days[i];
          		}
    
    			day_of_year += date.getDate();
            	return day_of_year;
            }
    
            /*日历时间转年积日*/
            function CalendarDateToDayOfYear () {
            	if (undefined != document.getElementById("calendar_date") && undefined != document.getElementById("calendar_dayofyear")) {
            		
            		var date = document.getElementById("calendar_date").value;
                	if (undefined != date && null != date && "" != date) {
                		var arr = date.split(/[-]/);
                		if (3 >= arr.length) {
                			var date = new Date();       			
                			date.setFullYear(arr[0]);
                			date.setMonth(arr[1]-1);
                			date.setDate(arr[2]);
            				document.getElementById("calendar_dayofyear").innerHTML = CalculateDayOfYear(date);
            			}
            		}
            	}
            }
    
    		/*定时1秒执行RefreshDateTime函数*/
    		//setInterval("RefreshDateTime();", 1000);
    
    		/*仅执行一次*/
    		//setTimeout("RefreshDateTime();", 1000);
    
    		/*页面加载完成执行*/
    		window.onload = function () {
    			RefreshDateTime();
    
    			var timestamp_obj = document.getElementById("convert_timestamp");
    			if (undefined != timestamp_obj || null != timestamp_obj) {
    				var now = new Date();
    				timestamp_obj.value = parseInt(now.getTime()/1000);
    				ConvertTimestamp();
    			}
    
    			InitCalendar();
    			CalendarDateTimeToTimestamp();
    			CalendarDateToDayOfYear();
    		}
    		
    	</script>
    </head>
    <body>
    	
    	当前时间戳：<span id="current_timestamp"></span> <input type="button" name="button_RefreshDateTime" onclick="RefreshDateTime();" value="刷新"></br>
    	本地时间: <span id="current_localtime"></span></br>
    	UTC时间: <span id="current_utctime"></span></br>
    
    	<hr>
    
    	时间戳(单位s)：<input type="text" id="convert_timestamp"> <input type="button" name="button_convert_timestamp" value="转换" onclick="ConvertTimestamp();"></br>
    	转换结果:(<span id="convert_timestamp_label"></span>)</br>
    	本地时间: <span id="convert_localtime"></span></br>
    	UTC时间: <span id="convert_utctime"></span></br>
    
    	<hr>
    
    	<input type="datetime-local" id="calendar_datetime" onchange="CalendarDateTimeToTimestamp();"/> 时间戳(单位s)：<span id="calendar_timestamp"></span>
    
    	<hr>
    
    	<input type="date" id="calendar_date" onchange="CalendarDateToDayOfYear();"/> 年积日：<span id="calendar_dayofyear"></span>
    
    </body>
    </html>

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L25hbmZlaWJ1eWk_size_16_color_FFFFFF_t_70]: /images/20221022/5b7b318aee914aa8b2bea5a94c0779a2.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L25hbmZlaWJ1eWk_size_16_color_FFFFFF_t_70 1]: /images/20221022/c4f0df62847c46feb1e15d320cf17a0b.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L25hbmZlaWJ1eWk_size_16_color_FFFFFF_t_70 2]: /images/20221022/29a28bd1e7cb44fd8483ee1c9f4a7fe0.png