动态加载js的方法 显示加载后的天气预报查询结果

我在论坛上找了很多动态加载js的方法答案，效果不是很理想，后来在sina里看到了答案。

缘由是这样的：

我现在需要动态取天气预报，sina里有查询的api

url是：http://php.weather.sina.com.cn/iframe/index/w_cl.php?code=js&day=0&city=上海

该url返回的一个js方法

内容是：

(function(){var w=[];w['上海']=[{s1:'雷阵雨',s2:'雷阵雨',f1:'leizhenyu',f2:'leizhenyu',t1:'35',t2:'27',p1:'3-4',p2:'3-4',d1:'西南风',d2:'东风'}];var add={now:'2011-07-04 15:17:20',time:'1309763840',update:'北京时间07月04日08:00更新',error:'0',total:'1'};window.SWther={w:w,add:add};})();//0 

 

我程序需要调用这个接口，并解析其中的数据显示在页面上，我先通过程序读取该url，并把返回的js原样不变动态输出

程序接口叫：sinaweather.action?city=上海

此时我页面需要使用jquery的方式动态调用我的action并把查询回来的结果显示在我的页面上

这需要使用到动态加载js，因为我的页面每输入一个城市，都要动态调用sinaweather.action?city=输入城市名 来方法返回对应城市的js代码，我把论坛上动态加载js的方式都使用了，但是就是不能取得sina返回的js代码中定义的参数SWther，再次点击则可以，原因分析是因为js是异步加载的，我点击查询的上海可能还没完成加载完成，这时候调用sina返回的js是有问题的。在sina里看到了答案：

 

 

	function fetch_js(url,dispose){
		var Snode = document.createElement("script");
		Snode.setAttribute("type", "text/javascript");
		if(url.indexOf("?") != -1){
			url += "&random=" + (new Date()).getTime();
		}else{
			url += "?random=" + (new Date()).getTime();
		};
		Snode[Snode.onreadystatechange === null ? "onreadystatechange" : "onload"] = function(){
			if (this.onreadystatechange){
				if (this.readyState != "loaded" && this.readyState != "complete") {return false;}
			};
			if(dispose){dispose()};//完成js加载后，这里调用显示查询结果显示在页面上
			this[this.onreadystatechange ? "onreadystatechange" : "onload"] = null;
		}
		Snode.setAttribute("src", url);
		document.getElementsByTagName("head")[0].appendChild(Snode);	
	}

 

	function show(){
  	 for(i in SWther.w){
	  var s1= SWther.w[i][0].s1;
	  var h_t1= SWther.w[i][0].t1;
	  var l_t2= SWther.w[i][0].t2;
	  var d1 = SWther.w[i][0].d1;
	  var p1 = SWther.w[i][0].p1;
	  var s = "天气情况："+s1+"，最高气温："+h_t1+"，最低气温："+l_t2+"，"+d1+" "+p1+"级";
	  $("#weather").html(s);	
	 }
	}

 

 

function go(){
	var city = $("#city").val();
	alert(city);
	var url = encodeURI("./sinaWeather.action?city="+city+"&r="+Math.random());
	fetch_js(url,show);
}

 

输入城市名:<input type="text" id="city" name="city" value="上海"/>
<input type="button" name="c_l" onclick="go()" value="查询">

<div id="weather"></div>