`

js 天气、日期、时间

阅读更多
今天在公司首页做了个天气、日期和时间的页面,效果图如下:


代码如下:
/****天气插件链接代码(可在http://www.thinkpage.cn/weather/widget.aspx自己个性化定制)*****/
<iframe src="http://www.thinkpage.cn/weather/weather.aspx?uid=&c=CHXX0037&l=zh-CHS&p=CMA&a=0&u=C&s=31&m=1&x=1&d=3&fc=FFFFFF&bgc=&bc=&ti=1&in=1&li=2&ct=iframe" frameborder="0" scrolling="no" width="660" height="80" allowTransparency="true">
</iframe>

/***中国天气网也有不错的插件,地址如下:****/http://service.weather.com.cn/plugin/index.shtml


//获取当前年  月
function Year_Month(){ 
		var now = new Date(); 
		var yy = now.getYear(); 
		var mm = now.getMonth()+1; 
		return(yy + '年' + mm + '月'); 
	} 
	[b]//获取当前日[/b]	function Date_of_Today(){ 
		var now = new Date(); 
		return(now.getDate()+'日'); 
	} 
	[b]//获取当前星期[/b]	
	function Day_of_Today(){ 
		var day = new Array(); 
		day[0] = "星期日"; 
		day[1] = "星期一"; 
		day[2] = "星期二"; 
		day[3] = "星期三"; 
		day[4] = "星期四"; 
		day[5] = "星期五"; 
		day[6] = "星期六"; 
		var now = new Date(); 
		return(day[now.getDay()]); 
	} 
	[b]//获取当前时间[/b]	
function CurentTime(){ 
		var now = new Date(); 
		var hh = now.getHours(); 
		var mm = now.getMinutes(); 
		var ss = now.getTime() % 60000; 
		ss = (ss - (ss % 1000)) / 1000; 
		var clock = hh+':'; 
		if (mm < 10) clock += '0'; 
		clock += mm+':'; 
		if (ss < 10) clock += '0'; 
		clock += ss; 
		return(clock); 
	}  
	[b]//*************农历[/b]
	function RunGLNL(){
		var today=new Date();
		var d=new Array("周日","周一","周二","周三","周四","周五","周六");
		var DDDD= d[today.getDay()];
		DDDD = DDDD+ " " + (CnDateofDateStr(today)); //显示农历
		DDDD = DDDD+SolarTerm(today); //显示二十四节气
		document.write(DDDD);
	}
	function DaysNumberofDate(DateGL){
		return parseInt((Date.parse(DateGL)-Date.parse(DateGL.getFullYear()+"/1/1"))/86400000)+1;
	}
	function CnDateofDate(DateGL){
		var CnData=new Array(
		0x16,0x2a,0xda,0x00,0x83,0x49,0xb6,0x05,0x0e,0x64,0xbb,0x00,0x19,0xb2,0x5b,0x00,
		0x87,0x6a,0x57,0x04,0x12,0x75,0x2b,0x00,0x1d,0xb6,0x95,0x00,0x8a,0xad,0x55,0x02,
		0x15,0x55,0xaa,0x00,0x82,0x55,0x6c,0x07,0x0d,0xc9,0x76,0x00,0x17,0x64,0xb7,0x00,
		0x86,0xe4,0xae,0x05,0x11,0xea,0x56,0x00,0x1b,0x6d,0x2a,0x00,0x88,0x5a,0xaa,0x04,
		0x14,0xad,0x55,0x00,0x81,0xaa,0xd5,0x09,0x0b,0x52,0xea,0x00,0x16,0xa9,0x6d,0x00,
		0x84,0xa9,0x5d,0x06,0x0f,0xd4,0xae,0x00,0x1a,0xea,0x4d,0x00,0x87,0xba,0x55,0x04
	);
	var CnMonth=new Array();
	var CnMonthDays=new Array();
	var CnBeginDay;
	var LeapMonth;
	var Bytes=new Array();
	var I;
	var CnMonthData;
	var DaysCount;
	var CnDaysCount;
	var ResultMonth;
	var ResultDay;
	var yyyy=DateGL.getFullYear();
	var mm=DateGL.getMonth()+1;
	var dd=DateGL.getDate();
	if(yyyy<100) yyyy+=1900;
	  if ((yyyy < 1997) || (yyyy > 2020)){
	    return 0;
	    }
	  Bytes[0] = CnData[(yyyy - 1997) * 4];
	  Bytes[1] = CnData[(yyyy - 1997) * 4 + 1];
	  Bytes[2] = CnData[(yyyy - 1997) * 4 + 2];
	  Bytes[3] = CnData[(yyyy - 1997) * 4 + 3];
	  if ((Bytes[0] & 0x80) != 0) {CnMonth[0] = 12;}
	  else {CnMonth[0] = 11;}
	  CnBeginDay = (Bytes[0] & 0x7f);
	  CnMonthData = Bytes[1];
	  CnMonthData = CnMonthData << 8;
	  CnMonthData = CnMonthData | Bytes[2];
	  LeapMonth = Bytes[3];
	for (I=15;I>=0;I--){
	    CnMonthDays[15 - I] = 29;
	    if (((1 << I) & CnMonthData) != 0 ){
	      CnMonthDays[15 - I]++;}
	    if (CnMonth[15 - I] == LeapMonth ){
	      CnMonth[15 - I + 1] = - LeapMonth;}
	    else{
	      if (CnMonth[15 - I] < 0 ){CnMonth[15 - I + 1] = - CnMonth[15 - I] + 1;}
	      else {CnMonth[15 - I + 1] = CnMonth[15 - I] + 1;}
	      if (CnMonth[15 - I + 1] > 12 ){ CnMonth[15 - I + 1] = 1;}
	    }
	  }
	  DaysCount = DaysNumberofDate(DateGL) - 1;
	  if (DaysCount <= (CnMonthDays[0] - CnBeginDay)){
	    if ((yyyy > 1901) && (CnDateofDate(new Date((yyyy - 1)+"/12/31")) < 0)){
	      ResultMonth = - CnMonth[0];}
	    else {ResultMonth = CnMonth[0];}
	    ResultDay = CnBeginDay + DaysCount;
	  }
	  else{
	    CnDaysCount = CnMonthDays[0] - CnBeginDay;
	    I = 1;
	    while ((CnDaysCount < DaysCount) && (CnDaysCount + CnMonthDays[I] < DaysCount)){
	      CnDaysCount+= CnMonthDays[I];
	      I++;
	    }
	    ResultMonth = CnMonth[I];
	    ResultDay = DaysCount - CnDaysCount;
	  }
	  if (ResultMonth > 0){
	    return ResultMonth * 100 + ResultDay;}
	  else{return ResultMonth * 100 - ResultDay;}
	}
	[b]//年[/b]	
function CnYearofDate(DateGL){
		var YYYY=DateGL.getFullYear();
		var MM=DateGL.getMonth()+1;
		var CnMM=parseInt(Math.abs(CnDateofDate(DateGL))/100);
		if(YYYY<100) YYYY+=1900;
		if(CnMM>MM) YYYY--;
		YYYY-=1864;
		return CnEra(YYYY)+"年";
	}
	[b]//月[/b]	
function CnMonthofDate(DateGL){
		var  CnMonthStr=new Array("零","正","二","三","四","五","六","七","八","九","十","冬","腊");
		var  Month;
	  	Month = parseInt(CnDateofDate(DateGL)/100);
	  	if (Month < 0){
	  		return "闰" + CnMonthStr[-Month] + "月";
	  	}
	  	else{
	  		return CnMonthStr[Month] + "月";
	  	}
	}
	[b]//日[/b]	
function CnDayofDate(DateGL){
		var CnDayStr=new Array("零",
	    "初一", "初二", "初三", "初四", "初五",
	    "初六", "初七", "初八", "初九", "初十",
	    "十一", "十二", "十三", "十四", "十五",
	    "十六", "十七", "十八", "十九", "二十",
	    "廿一", "廿二", "廿三", "廿四", "廿五",
	    "廿六", "廿七", "廿八", "廿九", "三十");
		var Day;
	  	Day = (Math.abs(CnDateofDate(DateGL)))%100;
	  	return CnDayStr[Day];
	}
	function DaysNumberofMonth(DateGL){
		var MM1=DateGL.getFullYear();
	    MM1<100 ? MM1+=1900:MM1;
		var MM2=MM1;
	    MM1+="/"+(DateGL.getMonth()+1);
	    MM2+="/"+(DateGL.getMonth()+2);
	    MM1+="/1";
	    MM2+="/1";
		return parseInt((Date.parse(MM2)-Date.parse(MM1))/86400000);
	}
	function CnEra(YYYY){
		var Tiangan=new Array("甲","乙","丙","丁","戊","己","庚","辛","壬","癸");
		//var Dizhi=new Array("子(鼠)","丑(牛)","寅(虎)","卯(兔)","辰(龙)","巳(蛇)",
	                    //"午(马)","未(羊)","申(猴)","酉(鸡)","戌(狗)","亥(猪)");
		var Dizhi=new Array("子","丑","寅","卯","辰","巳","午","未","申","酉","戌","亥");
		return Tiangan[YYYY%10]+Dizhi[YYYY%12];
	}
	[b]//农历年[/b]
	function CnDateofDateStr(DateGL){
		if(CnMonthofDate(DateGL)=="零月") 
		return " 请调整您的计算机日期!";
		else 
		return "农历"+CnYearofDate(DateGL)+ " " + CnMonthofDate(DateGL) + CnDayofDate(DateGL);
	}
	[b]//二十四节气[/b]	
function SolarTerm(DateGL){
	  var SolarTermStr=new Array(
	        "小寒","大寒","立春","雨水","惊蛰","春分",
	        "清明","谷雨","立夏","小满","芒种","夏至",
	        "小暑","大暑","立秋","处暑","白露","秋分",
	        "寒露","霜降","立冬","小雪","大雪","冬至");
	  var DifferenceInMonth=new Array(
	        1272060,1275495,1281180,1289445,1299225,1310355,
	        1321560,1333035,1342770,1350855,1356420,1359045,
	        1358580,1355055,1348695,1340040,1329630,1318455,
	        1306935,1297380,1286865,1277730,1274550,1271556);
	  var DifferenceInYear=31556926;
	  var BeginTime=new Date(1901/1/1);
	  BeginTime.setTime(947120460000);
	     for(;DateGL.getFullYear()<BeginTime.getFullYear();){
	        BeginTime.setTime(BeginTime.getTime()-DifferenceInYear*1000);
	     }
	     for(;DateGL.getFullYear()>BeginTime.getFullYear();){
	        BeginTime.setTime(BeginTime.getTime()+DifferenceInYear*1000);
	     }
	     for(var M=0;DateGL.getMonth()>BeginTime.getMonth();M++){
	        BeginTime.setTime(BeginTime.getTime()+DifferenceInMonth[M]*1000);
	     }
	     if(DateGL.getDate()>BeginTime.getDate()){
	        BeginTime.setTime(BeginTime.getTime()+DifferenceInMonth[M]*1000);
	        M++;
	     }
	     if(DateGL.getDate()>BeginTime.getDate()){
	        BeginTime.setTime(BeginTime.getTime()+DifferenceInMonth[M]*1000);
	        M==23?M=0:M++;
	     }
	  var JQ="";
	  if(DateGL.getDate()==BeginTime.getDate()){
	    JQ+="    今日 <font color='#598F03'><b>"+SolarTermStr[M] + "</b></font>";
	  }
	  else if(DateGL.getDate()==BeginTime.getDate()-1){
	    JQ+="  明日 <font color='#598F03'><b>"+SolarTermStr[M] + "</b></font>";
	  }
	  else if(DateGL.getDate()==BeginTime.getDate()-2){
	    JQ+="  后日 <font color='#598F03'><b>"+SolarTermStr[M] + "</b></font>";
	  }
	  else{
	   JQ="";
	   if(DateGL.getMonth()==BeginTime.getMonth()){
	      JQ+=" 本月";
	   }
	   else{
	     JQ+=" 下月";
	   }
	   JQ+=BeginTime.getDate()+"日"+"<font color='#598F03'><b>"+SolarTermStr[M]+"</b></font>";
	  }
		return JQ;
	}



具体如何组合就看你自己的了.^_^
分享到:
评论

相关推荐

    js 获取当天的天气预报、城市、时间

    简单的代码 获取当前所在城市 、天气 、时间

    天气+地位+日期+时间html页面

    本页面为html文件,使用了js+css+html,定时器,实现了天气+城市+日期+时间功能。实验好用,

    JS天气预报网页控件

    通常会包含天气图标、温度、日期/时间、天气描述等元素。 4. **交互性**:用户可以通过控件进行简单的交互,如切换城市、查看详细预报等。 5. **可编辑性**:开发者可以根据需求自定义控件的外观和行为,例如修改...

    jQuery自动获取本地时间日期天气预报代码.zip

    在提供的压缩包文件中,`说明.htm`可能包含了这个功能的使用指南,而`jQuery自动获取本地时间日期天气预报代码`可能是实现该功能的JavaScript代码文件。通过结合这两个资源,开发者可以快速理解并应用这个jQuery插件...

    js显示时间 农历 节日节气 - 自动刷新不带格式

    在JavaScript(JS)编程中,处理时间、农历和节日节气是常见的需求,尤其是在开发网页应用时。本文将深入探讨如何使用JavaScript实现这些功能,并基于提供的"js显示时间 农历 节日 - 自动刷新不带格式.html"文件进行...

    js公历日期转农历日期.txt

    ### js公历日期转农历日期知识点详解 #### 1. 背景介绍 在日常生活中,农历(阴历)与公历(阳历)之间的转换对于节日庆祝、传统活动等有着重要的意义。例如,春节、中秋节等中国传统节日都是根据农历来确定日期的...

    jQuery自动获取本地时间日期天气预报特效源码.zip

    该压缩包文件"jQuery自动获取本地时间日期天气预报特效源码.zip"主要涉及JavaScript库jQuery的使用,特别是关于动态展示本地时间和天气预报的功能。在网页开发中,这种特效可以提升用户体验,让信息更加实时和直观。...

    js获取年月日农历24气节

    总的来说,利用JavaScript库“chinaDate-min.js”和“chinaDate.js”,我们可以轻松地在Web应用中集成农历日期和24节气的显示和查询功能。开发过程中,需要注意选择合适的库,理解其API,并正确地在项目中引用和使用...

    天气预报_HTML静态页面_带时钟.zip

    在这个项目中,HTML将用于创建各个元素,如标题、日期时间、温度、天气和地点等。通过`&lt;head&gt;`、`&lt;body&gt;`、`&lt;h1&gt;`、`&lt;p&gt;`等标签,可以组织网页的内容和布局。 2. **CSS(Cascading Style Sheets)**: CSS负责网页的...

    jquery+UI+数字时间以及天气预报

    在本项目中,“jquery+UI+数字时间以及天气预报”是一个综合性的前端开发示例,它结合了jQuery库、jQuery UI框架以及实时的数字时钟和天气预报功能。这个项目旨在帮助开发者学习如何利用这些技术来创建交互式、动态...

    jQuery自动获取本地时间日期天气预报特效代码

    总结来说,"jQuery自动获取本地时间日期天气预报特效代码"是一个结合了JavaScript日期处理、Ajax请求、JSON解析、动态更新和UI特效的jQuery插件。理解并运用这些知识点,可以帮助你构建更丰富的前端交互功能。

    jquery UI 数字时间以及天气预报

    我们可以使用jQuery UI的`ui.core.js`和`ui.widget.js`基础组件,再结合自定义的JavaScript代码来创建一个动态更新的时间显示。通过定时器(如`setInterval`函数)每隔一定间隔刷新时间,使得用户界面上的时间保持...

    天气预报代码实现

    在编程领域,实现天气预报代码是一项综合性的任务,它涵盖了数据获取、数据处理、地理位置解析、日期时间操作以及可能的图形界面展示等多个方面。以下是一些相关知识点的详细说明: 1. **API接口使用**:通常,天气...

    基于Html5 svg+snap.svg实现带日期的天气预报特效源码.zip

    开发者可能使用JavaScript的内置Date对象来处理日期,或者使用第三方库如moment.js来提供更强大的日期和时间处理功能。 6. **动画效果**:Snap.svg库支持基于时间和帧的动画,使得天气图标和其他SVG元素可以平滑地...

    java获取某地天气

    4. **日期与时间处理**:天气预报包括未来几天的时间戳,需要将这些时间戳转换为人类可读的日期和时间。Java 8引入了`java.time`包,包含`Instant`、`LocalDate`、`LocalTime`等类,可以方便地进行日期和时间操作。 ...

    js获得时间

    在JavaScript中获取时间是一项基本且重要的任务,这涉及到日期和时间对象的使用。本篇将深入探讨如何在JavaScript中获取和操作时间。 在JavaScript中,我们可以使用内置的`Date`对象来处理日期和时间。`Date`对象...

    百度首页“天气预报”静态页面样式

    在这个项目中,“天气预报”是一个典型的动态数据,但在这里我们将其转化为静态页面,意味着数据不再实时更新,而是固定为某个时间点的天气信息。 文件`weather.css`是CSS(Cascading Style Sheets)文件,它是用来...

    日期、日历插件

    首先,我们来看“日期时间的格式”。日期和时间的格式化是处理日期信息的关键部分。常见的格式有“年-月-日”、“月/日/年”、“年月日”等,而时间则通常以“时:分:秒”显示。不同的场景可能需要不同的格式,例如在...

    C++天气信息获得代码

    可以使用`std::chrono::system_clock`获取当前时间,`std::chrono::parse`进行日期时间字符串解析,然后进行比较或格式化输出。 5. **数据结构设计**:为了存储和操作天气信息,你需要定义合适的C++数据结构。这...

Global site tag (gtag.js) - Google Analytics