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

复制代码 代码如下:

  <%@ 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);

  %>