ajax实战篇---天气或者其他股票连续变动----json交互

最新推荐文章于 2022-05-10 20:39:14 发布

孙中明

最新推荐文章于 2022-05-10 20:39:14 发布

阅读量812

点赞数

分类专栏： # Ajax 文章标签： ajax xml json

感谢阅读到这里的你，总结会有不足之处，欢迎评论留言，讨论交流~

本文链接：https://blog.csdn.net/jankin6/article/details/72811158

版权

Ajax 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
     <title>天气预报</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<meta http-equiv="Content-type" content="text/html;charset=utf-8" />
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
<script type="text/javascript">
<!--
	//abc()表示要调用函数,5000表示每隔3秒去调用abc();
	
	
	
	//第一步-------------------------------------------------------创建ajax引擎    
    function getXmlHttpObject(){    
         
        var xmlHttpRequest;    
        //不同的浏览器获取对象xmlhttprequest 对象方法不一样    
        if(window.ActiveXObject){    
                
            xmlHttpRequest=new ActiveXObject("Microsoft.XMLHTTP");//这个是ie内核    
                
        }else{    
    
            xmlHttpRequest=new XMLHttpRequest();//非ie内核    
        }    
    
        return xmlHttpRequest;//将创建创建的ajax引擎实例化    
    
    }    
    
    var myXmlHttpRequest="";//设置全局变量 为了后面的chuli 函数需要取得属性    
  
  
    //第二步----------------------------------------------------------------------获取数据并发送服务器   
    function sendRequest(){  
	  
         myXmlHttpRequest=getXmlHttpObject();//从实例化的模型里面的方法函数     
  
        if(myXmlHttpRequest){  
            var url="doweather.php";//url 属性 选择提交的地址    
            var data="city[]=bj&city[]=sh&city[]=cd"//数据 id为sheng的数据取得数据    
            myXmlHttpRequest.open("post",url,true);//这里选择提交的方式post  异步操作  
            myXmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//打开请求.    
    
            //指定为了第四步处理做准备回调函数.chuli是函数名    
			
		
			
            myXmlHttpRequest.onreadystatechange=function chuli(){
					
				if(myXmlHttpRequest.readyState==4){  
				
					if(myXmlHttpRequest.status==200){  
					
						var res_obj=eval("("+myXmlHttpRequest.responseText+")");
					
						$('bj').innerText=res_obj[0].price;
						$('sh').innerText=res_obj[1].price;
						$('cd').innerText=res_obj[2].price;
					
					}
	  
					
				}    
			}
			myXmlHttpRequest.send(data);    
				
            //第二部--------------------------发送数据到服务器端    
           
        }  
          
          
    }  
		
		

    function $(id){    
        return document.getElementById(id);    
    }   

window.setInterval("sendRequest()",1000);	
	
-->
</script>
  </head>
  
  <body>
    <center>
    <h1>每隔5秒中更新数据</h1>
    <table border="1">
    <tr><td>城市</td><td>温度</td></tr>
    <tr><td >北京</td><td id="bj">21℃</td></tr>
    <tr><td >上海</td><td id="sh">20℃</td></tr>
    <tr><td >成都</td><td id="cd">11℃</td></tr>
    </table>
   
    </center>
  </body>
</html>

<?php


	header("Content-Type: text/html;charset=utf-8");
	//告诉浏览器不要缓存数据
	header("Cache-Control: no-cache");
	//获取城市的名字
	
	$cities=$_POST['city'];
	$res='[';
	for($i=0;$i<count($cities);$i++){
		
		if($i==count($cities)-1){
		$res.='{"cityname":"'.$cities[$i].'","price":"'.rand(0,40).'℃"}]';
		}else{
		$res.='{"cityname":"'.$cities[$i].'","price":"'.rand(0,40).'℃"},';	
		}
	}

	echo $res;
	
?>

孙中明

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
ajax实战篇---天气或者其他股票连续变动----json交互

天气预报 <!-- //abc()表示要调用函数,5000表示每隔3秒去调用abc(); //第一步-------------------------------------------------------创建ajax引擎 function getXmlHttpObject(){
复制链接

扫一扫