要玩json首先就需要知道一般都数据是怎么处理的：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <script>

        function createXHR(){

            var xhr = null;

            if(window.XMLHttpRequest){

                xhr = new XMLHttpRequest();

            }else if(window.ActiveXObject){

                xhr = new ActiveXObject("Microsoft.XMLHTTP");

            }

            return xhr;

        }

        function test1(){

            var xhr = createXHR();

            xhr.open('GET','8.php',true);

            xhr.onreadystatechange = function(){

                if(this.readyState == 4){

                    document.getElementById('lists').innerHTML = this.responseText;

                }

            }

            xhr.send(null);

        }

    </script>

</head>

<body>

    <input type="button" value="更新歌曲" onclick="test1();">

    <div id="lists"></div>

</body>

</html>

<?php

    header("Content-Type:text/html;charset=utf-8");

    foreach( array('夜夜十八摸','人狗情未了主题曲','左手右手慢动作','妹妹坐船头') as $v ){

        echo '<li>'.$v.'</li>';

    }

我们居然知道普通数据是怎么处理的了，那么json数据其实也是很简单的，不过是设计得比较巧妙，看上去好像很有规律，巧就巧在可以让javascript当对象使用而已。。。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <style>

        ul{ list-style:none; }

    </style>

    <script>

        function createXHR(){

            var xhr = null;

            if(window.XMLHttpRequest){

                xhr = new XMLHttpRequest();

            }else if(window.ActiveXObject){

                xhr = new ActiveXObject("Microsoft.XMLHTTP");

            }

            return xhr;

        }

        function test1(){

            var xhr = createXHR();

            xhr.open('GET','8.php',true);

            xhr.onreadystatechange = function(){

                if(this.readyState == 4){

                    //alert(this.responseText);

                    var mp3 = eval('('+ this.responseText +')');

                    document.getElementById('title').innerHTML = mp3.title;

                    document.getElementById('desc').innerHTML = mp3.desc;

                }

            }

            xhr.send(null);

        }

    </script>

</head>

<body>

    <input type="button" value="更新歌曲" onclick="test1();">

    <ul>

        <li>

            <p id="title"></p>

            <p id="desc"></p>

        </li>

    </ul>

</body>

</html>

<?php

    $mp3 = array('title'=>'夜夜十八摸','desc'=>'男人夜夜都是泪');

    echo json_encode($mp3);

AJAX-----07XMLHttpRequest对象的处理返回的JSON类型数据的更多相关文章

  1. AJAX-----06XMLHttpRequest对象的处理返回的XML类型数据

    我们首先要确保XML文件是否正常执行 如果访问时候报类似  Parse error: syntax error, unexpected 'version' (T_STRING  这样的错误,我们则需要 ...

  2. Struts2+Jquery实现ajax并返回json类型数据

    来源于:http://my.oschina.net/simpleton/blog/139212 摘要 主要实现步骤如下: 1.JSP页面使用脚本代码执行ajax请求 2.Action中查询出需要返回的 ...

  3. 转载：Struts2+Jquery实现ajax并返回json类型数据

    摘要: 主要实现步骤如下: 1.JSP页面使用脚本代码执行ajax请求 2.Action中查询出需要返回的数据,并转换为json类型模式数据 3.配置struts.xml文件 4.页面脚本接受并处理数 ...

  4. springMvc 使用ajax上传文件，返回获取的文件数据 附Struts2文件上传

    总结一下 springMvc使用ajax文件上传 首先说明一下,以下代码所解决的问题 :前端通过input file 标签获取文件,通过ajax与后端交互,后端获取文件,读取excel文件内容,返回e ...

  5. javascript解析从服务器返回的json格式数据

    在javascript中我们可以将服务器返回的json格式数据转换成json格式进行使用,如下: 1.服务器返回的json格式数据: 通过response.responseText获得: " ...

  6. json进阶(一)js读取解析JSON类型数据

    js读取解析JSON类型数据 一.什么是JSON? JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式,同 ...

  7. C#操作json类型数据

    将对象序列化为 JavaScript 对象表示法 (JSON),并将 JSON 数据反序列化为对象. 此类不能继承. // msdn 例子: namespace SL_DataContractJson ...

  8. MySQL JSON 类型数据操作

    1.Java 中动态扩展字段,会导致数据库表被锁,在MySQL 5.7.8版本之前,因为MySQL不能直接操作JSON类型数据,可以将一个字段设定成varchar类型,里面存放JSON格式数据,这样在 ...

  9. js读取解析JSON类型数据【申明：来源于网络】

    js读取解析JSON类型数据[申明:来源于网络] 地址:http://blog.csdn.net/sunhuaqiang1/article/details/47026841

随机推荐

  1. linux文本操作界面 vi面板如何复制一行

    linux文本操作界面 vi面板如何复制一行 1)把光标移动到要复制的行上2)按yy3)把光标移动到要复制的位置4)按p 在vi里如何复制一行中间的几个字符?如果你要从光标处开始复制 4 个字符,则先 ...

  2. hdu 1312

    原题链接 题意:“@”为起点,“.”为路,求可以走的格子有多少个(包括起点) 水题 bfs搜一发 思路:只有可以走的节点才能进入队列,所以每次出队列时ans+1就可以了(没有退出条件,所有可进入的节点 ...

  3. Linux_scp命令

    一.简单概念  scp是有Security的文件copy , 基于ssh登录 二.使用 1. 发送(本地--->远程服务器) [liuwl@hadoop09-linux-02 hadoop-2. ...

  4. Odoo 仓库调拨移动过程中 单位不允许错误的分析及解决方案

    Odoo 仓库调拨过程中,有时候会碰见一下错误内容: The roundings of your Unit of Measures on the move vs.  on the product do ...

  5. HTML 几种特别分割线特效

    一.基本线条 二.特效(效果并不是孤立的,可相互组合)1.两头渐变透明:<HR style="FILTER: alpha(opacity=100,finishopacity=0,sty ...

  6. 完美扫描PHP特殊一句话后门

    <?php /********************** 作者 Spider 网上公布的各种PHP后门全军覆没 针对一些特殊变形的后门需要自己添加特征 误报率不到百分之一 ********** ...

  7. java四种内部类详解

    一般来说,有4中内部类:常规内部类.静态内部类.局部内部类.匿名内部类. 一.常规内部类:常规内部类没有用static修饰且定义在在外部类类体中.   1.常规内部类中的方法可以直接使用外部类的实例变 ...

  8. 四则运算之C++实现篇

    对四则运算的一些要求如下: 1.题目避免重复:2.可定制(数量/打印方式):3.可以控制下列参数:   是否有乘除法.数值范围.加减有无负数.除法有无余数.否支持分数 (真分数, 假分数, …): 一 ...

  9. BLOB

    BLOB (binary large object),二进制大对象,是一个可以存储二进制文件的容器.在计算机中,BLOB常常是数据库中用来存储二进制文件的字段类型.BLOB是一个大文件,典型的BLOB ...

  10. Bootstrap:表格和栅格分页

      拼接table请将以下代码直接运行:换下 bootstrap.css jquery-1.12.3.min.js bootstrap-paginator.min.js" <!DOCT ...