通过ajax实现请求url地址,并获取到报文后,并返回给标签
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>未来五日天气预报</title> </head> <body> <div id=\'input3\'>dfdfe</div> <div id=\'input2\'>dfdfe</div> <div id=\'input1\'>dfdfe</div> </body> <script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script> <script> $(document).ready(function(){ getdata(); //执行下面定义的getdata()函数。 setInterval("getdata()",2000);//N毫秒刷新一次,1000毫秒=1秒 //实现无限循环执行getdata() }); function getdata(){ var myDate = new Date(); //定义一个日期实例 $("#input3").html(myDate.toLocaleString())//获取日期与时间 ,并将结果显示在id=input3的text中 var this_ity; //定义一个城市变量 //$.getScript 通过get方法请求url地址,然后再执行后面的回调函数(即:function()) $.getScript(\'http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js\', function() { //该地址是用来根据ip地址获取城市名字 //remote_ip_info 是url地址请求后的返回数据 //返回的格式是个人认为是json格式。 //json 格式为“名称:值”,如:var y={"desc":"OK","status":1000}; 如果想获取值,如:y.status此时y.status就等于1000; 名字不可重复。 if (remote_ip_info.ret == \'1\') { //判断报文返回数据正确 this_ity=remote_ip_info.city; //获取城市 } var urld="http://wthrcdn.etouch.cn/weather_mini?city="+this_ity; //获取天气预报的地址 $.ajax({ type: "GET", url: urld, dataType: "json", //指定数据类型为json success: function(data){ //成功请求url后,执行function(data)。 等同于$.getScrip /* * 返回的数据格式为: * {"desc":"OK","status":1000,"data":{"wendu":"22","ganmao":"风较大,较易发生感冒,注意防护。","forecast":[{"fengxiang":"北风","fengli":"5-6级","high":"高温 24℃","type":"晴","low":"低温 11℃","date":"3日星期六"},{"fengxiang":"北风","fengli":"4-5级","high":"高温 19℃","type":"晴","low":"低温 8℃","date":"4日星期日"},{"fengxiang":"无持续风向","fengli":"微风","high":"高温 21℃","type":"晴","low":"低温 9℃","date":"5日星期一"},{"fengxiang":"无持续风向","fengli":"微风","high":"高温 21℃","type":"多云","low":"低温 10℃","date":"6日星期二"},{"fengxiang":"无持续风向","fengli":"微风","high":"高温 24℃","type":"晴","low":"低温 12℃","date":"7日星期三"},{"fengxiang":"无持续风向","fengli":"微风","high":"高温 23℃","type":"晴","low":"低温 11℃","date":"8日星期四"}],"yesterday":{"fl":"微风","fx":"无持续风向","high":"高温 23℃","type":"晴","low":"低温 12℃","date":"2日星期五"},"aqi":"59","city":"北京"}} */ var json=data.data; $("#input2").html(json.city) var fengli=json.forecast[0].low;//因 data.data 的值是一个数组 。所以需要forecast[0] $("#input1").html(fengli) } }); }); } </script> </html>