zoukankan      html  css  js  c++  java
  • 5月17 AJAX返回类型-------JSON和XML

    ajax返回类型有TEXT,JSON,XML

    一.TEXT

      查看之前的练习

    二.JSON

    var js = {

              aa:{code:"p001",name:"张三"},

               bb:{code:"p002",name:"李四"},

            };

              for(key in js)

              {

                  alert(key);

              }

    显示数据页面----显示结果是索引数组

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>返回类型JSON</title>
    <script src="../jquery-1.11.2.min.js">
    </script>
    </head>
    
    <body>
    
    <select id="sel"></select>
    
    </body>
    </html>
    <script type="text/javascript">
    $(document).ready(function(e) {
        
    	$.ajax({
    		
    		url:"chulijson.php",
    		dataType:"JSON",
    		success: function(data){
    			
    			//alert(data);
    			/*var str ="";//方法一
    			for(k in data)
    			{
    				str+="<option value='"+data[k][0]+"'>"+data[k][1]+"</option>";	
    			}			
    			
    			$("#sel").html(str);*/
    			
    			var str ="";//方法二
    			for(var i=0;i<data.length;i++)
    			{
    				str+="<option value='"+data[i][0]+"'>"+data[i][1]+"</option>";	
    			}
    			$("#sel").html(str);
    			
    			}
    		});
    });
    </script>
    

      

    处理页面

    <?php
    
    include("DBDA.php");
    $db = new DBDA();
    
    $sql = "select * from Nation";
    $attr = $db->Query($sql);
    
    echo json_encode($attr);
    

      效果展示

    三.XML

    XML:页面之间传递数据,跨平台传递

    HTML:超文本标记语言,核心标签

    XML特点:
    1.标签名可以自己定义
    2.有且只有一个根
    3.大小写敏感
    4.标签必须完整

    书写规则如下所示:

    <xml version='1.0'>
    <Nation>     //自定义并且成对出现有且只有一个
      <one>
        <code>111</code>
        <name>qqq</name>
       </one>

      <two>
        <code>222</code>
        <Name>ppp</Name>
      </two>
    </Nation>

    在网页中显示结果是:111  qqq   222   ppp

    上面例题的另一种做法

    数据显示页面

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>返回类型之XML</title>
    <script src="../jquery-1.11.2.min.js">
    </script>
    </head>
    
    <body>
    
    <select id="sel"></select>
    </body>
    </html>
    <script type="text/javascript">
    $(document).ready(function(e) {
        
    	$.ajax({
    		
    		url:"chuliXML.php",
    		dataType:"XML",
    		success: function(data){
    			
    			//alert(data);
    			var ch = $(data).find("nation").children();
    			var str ="";
    			for(var i=0;i<ch.length;i++)
    			{
    				var code = $(ch[i]).find("code").text();
    				var name = $(ch[i]).find("name").text();
    				
    				str+="<option value='"+code+"'>"+name+"</option>";
    			}
    			
    			$("#sel").html(str);
    			
    			}
    		});
    	
    });
    
    </script>
    

      

    处理页面

    <?php
    include("DBDA.php");
    $db = new DBDA();
    
    $sql = "select * from Nation";
    
    $attr = $db->Query($sql);
    
    echo "<nation>";
    
    foreach($attr as $k=>$v)
    {
    	echo "<shuju{$k}>";
    		
    		echo "<code>{$v[0]}</code>";
    		echo "<name>{$v[1]}</name>";
    		
    	echo "</shuju{$k}>";
    }
    
    echo "</nation>";
    

      

             

  • 相关阅读:
    异常部分
    5.Spring Cloud初相识-------Hystrix熔断器
    4.Spring Cloud初相识--------Feign负载均衡
    3.Spring Cloud初相识--------Ribbon客户端负载均衡
    2.Spring Cloud初相识--------Eureka服务注册与消费
    17、SpringBoot------整合dubbo
    3.Hadoop测试Yarn和MapReduce
    2.Hadoop集群安装进阶
    1.Hadoop集群安装部署
    3.Netty的粘包、拆包(二)
  • 原文地址:https://www.cnblogs.com/Duriyya/p/5505957.html
Copyright © 2011-2022 走看看