用javascript为页面添加天气显示实现思路及代码


Posted in Javascript onDecember 02, 2013
<%@ page language="java" pageEncoding="UTF-8"%> 
<html> 
<head> 
<script> 
function load(cid) 
{ 
var xmlhttp; 
if (window.XMLHttpRequest) 
{// code for IE7+, Firefox, Chrome, Opera, Safari 
xmlhttp=new XMLHttpRequest(); 
} 
else 
{// code for IE6, IE5 
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
} 
xmlhttp.open("GET","date.jsp?cid="+cid,false); 
xmlhttp.send(); 
var obj = eval("("+ xmlhttp.responseText+")"); 
//var obj=JSON.parse(xmlhttp.responseText); //IE8以上 
document.getElementById("test").innerHTML=obj.weatherinfo.city+":"+obj.weatherinfo.weather1+" "+obj.weatherinfo.temp1; 
} 
</script> 
</head> 
<body> 
<p id="test">天气情况</p> 
<button id="btn1" onClick=load("101280601")>深圳天气</button> 
<button id="btn2" onClick=load("101250501")>郴州天气</button> 
<!-- 
城市id获取:http://blog.csdn.net/zgyulongfei/article/details/7956118 
--> 
</body> 
</html>

date.jsp
<%@ page language="java" import="java.net.*,java.io.*" pageEncoding="utf-8"%> 
<% 
String cid = request.getParameter("cid"); 
URL url = new URL("http://m.weather.com.cn/data/"+cid+".html"); 
HttpURLConnection httpConn = (HttpURLConnection) url.openConnection(); 
httpConn.connect(); 
InputStream cin = httpConn.getInputStream(); 
BufferedReader reader = new BufferedReader(new InputStreamReader(cin,"UTF-8")); 
StringBuffer sb = new StringBuffer(); 
String rl = null; 
while ((rl = reader.readLine()) != null) 
sb.append(rl); 
out.println(sb); 
%>
Javascript 相关文章推荐
基于Jquery的文字滚动跑马灯插件(一个页面多个滚动区)
Jul 26 Javascript
jquery 读取页面load get post ajax 四种方式代码写法
Apr 02 Javascript
Ajax 数据请求的简单分析
Apr 05 Javascript
js open() 与showModalDialog()方法使用介绍
Sep 10 Javascript
node.js中的fs.link方法使用说明
Dec 15 Javascript
Lab.js初次使用笔记
Feb 28 Javascript
jQuery中extend函数详解
Jul 13 Javascript
AngularJS入门教程之AngularJS 模板
Aug 18 Javascript
浅谈Vue内置component组件的应用场景
Mar 27 Javascript
vue使用ElementUI时导航栏默认展开功能的实现
Jul 04 Javascript
React key值的作用和使用详解
Aug 23 Javascript
如何解决React官方脚手架不支持Less的问题(小结)
Sep 12 Javascript
给ListBox添加双击事件示例代码
Dec 02 #Javascript
js抽奖实现随机抽奖代码效果
Dec 02 #Javascript
javascript模拟地球旋转效果代码实例
Dec 02 #Javascript
js实现全屏漂浮广告移入光标停止移动
Dec 02 #Javascript
扩展JS Date对象时间格式化功能的小例子
Dec 02 #Javascript
判断JS对象是否拥有某种属性的两种方式
Dec 02 #Javascript
关于js中for in的缺陷浅析
Dec 02 #Javascript
You might like
php Try Catch异常测试
2009/03/01 PHP
php安装swoole扩展的方法
2015/03/19 PHP
ThinkPHP5.1表单令牌Token失效问题的解决
2019/03/22 PHP
锋利的jQuery 要点归纳(三) jQuery中的事件和动画(上:事件篇)
2010/03/24 Javascript
JavaScript中几个重要的属性(this、constructor、prototype)介绍
2013/05/19 Javascript
利用js读取动态网站从服务器端返回的数据
2014/02/10 Javascript
JavaScript程序员应该知道的45个实用技巧
2014/03/04 Javascript
封装好的js判断操作系统与浏览器代码分享
2015/01/09 Javascript
关于javascript原型的修改与重写(覆盖)差别详解
2016/08/31 Javascript
Vue.js 父子组件通讯开发实例
2016/09/06 Javascript
localStorage的黑科技-js和css缓存机制
2017/02/06 Javascript
javascript自定义事件功能与用法实例分析
2017/11/08 Javascript
Vue CLI3搭建的项目中路径相关问题的解决
2018/09/17 Javascript
vue-cli的build的文件夹下没有dev-server.js文件配置mock数据的方法
2019/04/17 Javascript
vue自定义js图片碎片轮播图切换效果的实现代码
2019/04/28 Javascript
深入理解redux之compose的具体应用
2020/01/12 Javascript
如何在 Vue 中使用 JSX
2021/02/14 Vue.js
python修改注册表终止360进程实例
2014/10/13 Python
Python按行读取文件的实现方法【小文件和大文件读取】
2016/09/19 Python
利用Python读取文件的四种不同方法比对
2017/05/18 Python
win10下Python3.6安装、配置以及pip安装包教程
2017/10/01 Python
python监控文件并且发送告警邮件
2018/06/21 Python
对pandas数据判断是否为NaN值的方法详解
2018/11/06 Python
python单向循环链表原理与实现方法示例
2019/12/03 Python
python实现用类读取文件数据并计算矩形面积
2020/01/18 Python
Python变量作用域LEGB用法解析
2020/02/04 Python
Marriott国际:万豪国际酒店查询预订
2017/09/25 全球购物
学前教育教师求职自荐信
2013/09/22 职场文书
室内设计专业学生的自我评价分享
2013/11/27 职场文书
通信工程专业毕业生推荐信
2013/12/25 职场文书
数控技术学生的自我评价
2014/02/15 职场文书
销售会计岗位职责
2014/03/15 职场文书
项目投资合作意向书
2014/07/29 职场文书
考试保密承诺书
2014/08/30 职场文书
2016暑期政治学习心得体会
2016/01/23 职场文书
JavaScript正则表达式实现注册信息校验功能
2022/05/30 Java/Android