首先建立json.txt文件

{

"programmers": [

{ "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" },

{ "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets.com" },

{ "firstName": "Elliotte", "lastName":"Harold", "email": "elharo@macfaq.com" }

],

"authors": [

{ "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" },

{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" },

{ "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" }

],

"musicians": [

{ "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" },

{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" }

]

}

通过异步调用，来读取json数据

<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

<script type="text/javascript">

var xmlHttp;

function createXMLHttpRequest()

{

    if(window.ActiveXObject)

    {

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

    }

    else if(window.XMLHttpRequest)

    {

        xmlHttp = new XMLHttpRequest();

    }

}

function startRequest()

{

    createXMLHttpRequest();

    try

    {

        xmlHttp.onreadystatechange = handleStateChange;

        xmlHttp.open("GET", "Json.txt", true);

        xmlHttp.send(null);

    }

    catch(exception)

    {

        alert("xmlHttp Fail");

    }

}

function handleStateChange()

{

    if(xmlHttp.readyState == 4)

    {

        if (xmlHttp.status == 200 || xmlHttp.status == 0)

        {

            var result = xmlHttp.responseText;

            var json = eval("(" + result + ")");

            alert(json.programmers[0].firstName);//读取json数据

            //alert(json.sex);

        }

    }

}

</script>

</head>

<body>

    <div>

        <input type="button" value="AjaxTest" onclick="startRequest();" />

    </div>

</body>

</html>

ajax读取json数据的更多相关文章

  1. js进阶ajax读取json数据（ajax读取json和读取普通文本，和获取服务器返回数据（链接）都是一样的，在url处放上json文件的地址即可）

    js进阶ajax读取json数据(ajax读取json和读取普通文本,和获取服务器返回数据(链接)都是一样的,在url处放上json文件的地址即可) 一.总结 ajax读取json和读取普通文本,和获 ...

  2. ajax(读取json数据)

    ajax知识点: 语法:$.ajax(路由,请求方式,返回的数据类型,数据参数,回调函数) url: "路由", type:"",默认get请求(get或pos ...

  3. js读取json数据（php传值给js）

    <?php $array =array('fds','fdsa','fdsafasd');  // json_encode($array); ?> <html> <hea ...

  4. 通过JQuery的$.ajax()把 json 数据 post 给 PHP

    通过JQuery的$.ajax()把 json 数据 post 给 PHP时的几种情况: 无法在PHP中通过$_POST 以及 $_REQUEST 获取json数据,即 $json = $_POST[ ...

  5. 关于跨域读取json数据我的理解

    这两天在做关于读取json数据的插件,想用getJSON读取数据: $.getJSON(http://www.xxxx.com/Titles.js, function (data) { console ...

  6. JS-利用ajax获取json数据，并传入页面生成动态tab

    封装好的:ajax.js function ajax(url, fnSucc,fnFaild){ //1[创建] if(window.XMLHttpRequest){ var oAjax = new ...

  7. json数据的格式，JavaScript、jQuery读取json数据

    JSON:JavaScript 对象表示法(JavaScript Object Notation). JSON的特点: JSON 是纯文本 JSON 具有“自我描述性”(人类可读) JSON 具有层级 ...

  8. ajax 发送json数据时为什么需要设置contentType: "application/json”

    1. ajax发送json数据时设置contentType: "application/json”和不设置时到底有什么区别? contentType: "application/j ...

  9. ajax发送json数据时为什么需要设置contentType: "application/json”

    1. ajax发送json数据时设置contentType: "application/json”和不设置时到底有什么区别?contentType: "application/js ...

随机推荐

  1. 【XJOI-NOIP16提高模拟训练9】题解。

    http://www.hzxjhs.com:83/contest/55 说实话这次比赛真的很水..然而我只拿了140分,面壁反思. 第一题: 发现数位和sum最大就是9*18,k最大1000,那么su ...

  2. 执行脚本出现bin/bash: bad interpreter: No such file or directory

    -bash: ./test.sh: /bin/bash^M: bad interpreter: No such file or directory VI打开文件,没发现任何问题, 把/bin/bash ...

  3. 网络安装之Redhat衍生版

    GNU/Linux开源,这个意义实在是非常的广泛,目前在distrowatch上表现活跃的300个发行版代表了GNU/Linux的主流,然而细心的Linux爱好者会发现CentOS-based dis ...

  4. 如何搭建配置php开发环境

    PHP的配置 1.打开解压后的C:\Program Files (x86)\php-5.3.5文件夹 1 将php.ini-development文件并更改名称为php.ini(留个备份,好习惯) 2 ...

  5. Android笔记——RecyclerView替代ListView

    ListView是常用列表控件,但设置Adapter时自定义代码较为复杂,因此Android3.0后,增加RecyclerView替代ListView RecyclerView没有提供OnItemCl ...

  6. R语言---热图的制作

    >install.packages("gplots") > library("gplots")> p <- data.frame(rea ...

  7. C# 值类型和引用类型的区别

    C#  值类型和引用类型的区别 1. 值类型的数据存储在内存的栈中:引用类型的数据存储在内存的堆中,而内存单元中只存放堆中对象的地址. 2. 值类型存取速度快,引用类型存取速度慢. 3. 值类型表示实 ...

  8. php抽象 与接口

    抽象方法和抽象类 PHP5支持抽象类和抽象方法.抽象类不能直接被实例化,你必须先继承该抽象类,然后再实例化子类.抽象类中 至少要包含一个抽象方法.如果类方法被声明为抽象的,那么其中就不能包括具体的功能 ...

  9. mmm hardware/libhardware_legacy/power/

    android源码目录下的build/envsetup.sh文件,描述编译的命令 - m:       Makes from the top of the tree.  - mm:      Buil ...

  10. $.getJSON ashx 跨域

    context.Response.AddHeader("Access-Control-Allow-Origin", "*");