<?php

header("content-type:text/html;charset=utf-8");

echo '{"name":"小明","age":"12","sex":"男"}';

?>
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<body>

<button id="bt1">点击获取json数据</button>

<script type="text/javascript">

    window.onload=function(){

        var bt1=document.getElementById("bt1");

        bt1.onclick=function(){

            //创建ajax对象，写兼容

            if(window.XMLHttpRequest){

                var xhr=new XMLHttpRequest();

            }else{

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

            };

            //设置发送数据的地址和方法

            xhr.open("POST","json.php");

            //设置我们的请求头信息,post方法才写请求头

            xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");

            //发送数据

            xhr.send();

            //绑定onreadystatechange事件

            xhr.onreadystatechange=function(){

                if(xhr.readyState==4 && xhr.status==200){

                    var data=xhr.responseText;

                    //json字符串转换成为json对象  , data=eval("("+data+")");evel不存在兼容性问题，但是会有安全漏洞。

                    data=JSON.parse(data);

                    var str="";

                    str+="姓名:"+data.name+"<br>";

                    str+="年龄:"+data.age+"<br>";

                    str+="性别:"+data.sex;

                    document.body.innerHTML=str;

                };

            };

        };

    };

</script>

</body>

</html>

　

原生ajax请求json数据的更多相关文章

  1. 关于使用Ajax请求json数据，@RequestMapping返回中文乱码的几种解决办法

    一.问题描述: 使用ajax请求json数据的时候,无论如何返回的响应编码都是ISO-8859-1类型,因为统一都是utf-8编码,导致出现返回结果中文乱码情况. $.ajax({ type:&quo ...

  2. bootstrap通过ajax请求JSON数据后填充到模态框

    1.   JSP页面中准备模态框 <!-- 详细信息模态框(Modal) --> <div> <div class="modal fade" id=& ...

  3. ajax请求json数据案例

    今天有这样一个需求,点击六个大洲,出现对应的一些请求信息,展示在下面,请求请求过后,第二次点击就无需请求.如图所示:点击北美洲下面出现请求的一些数据 html代码结构: <div class=& ...

  4. jQuery实例之ajax请求json数据案例

    今天有这样一个需求,点击六个大洲,出现对应的一些请求信息,展示在下面,请求请求过后,第二次点击就无需请求.如图所示:点击北美洲下面出现请求的一些数据 html代码结构: <div class=& ...

  5. ajax请求json数据跨域问题（转）

    一.后台代理技术 由服务器端向跨域下的网站发出请求,再将请求结果返回给前端,成功避免同源策略的限制. 具体操作如下: 1.在localhost:81/a.html中,向同源下的某个代理程序发出请求 $ ...

  6. ajax 请求json数据中json对象的构造获取问题

    前端的界面中,我想通过ajax来调用写好的json数据,并调用add(data)方法进行解析,请求如下: json数据如下: { “type”:"qqq", "lat&q ...

  7. 浅析ajax请求json数据并用js解析(示例分析)

    这应该是每个web开发的人员都应该掌握的基础技术,需要的朋友可以参考下 自从接触了jquery就喜欢上了前端开发,而且深深感受到了前端开发的强大与重要之处.同时也想为asp.net鸣不平,事实上asp ...

  8. Ajax请求Json数据，报500错误，后台没有错误日志。

    post请求:http://localhost:9080/DataDiscoveryWeb/issueformcount/queryIssueTendencyDetail.xhtml?jobId=86 ...

  9. Servlet处理原生Ajax请求

    萌新小白人生中的第一篇博客,难免会有差错,还望各位大佬多多包涵. 1. Ajax技术简介      Ajax(Asynchronous JavaScript and XML,异步JavaScript和 ...

随机推荐

  1. 以代码的方式管理quartz定时任务的暂停、重启、删除、添加等

    [前言]在项目的管理功能中,对定时任务的管理有时会很常见.因为我们不能指望只在配置文件中配置好定时任务就行了,因为如果要控制定时任务的 “暂停” 呢?暂停之后又要在某个时间点 “重启” 该定时任务呢? ...

  2. [JZOJ4913] 【GDOI2017模拟12.3】告别

    题目 描述 题目大意 给你两个排列AAA和BBB,每次随即选三个数进行轮换操作,问mmm次操作内使AAA变成BBB的概率. 思考历程 首先随便搞一下,就变成了AAA中每个数回归自己原位. 一眼望去,感 ...

  3. [JZOJ6011] 【NOIP2019模拟1.25A组】天天爱跑步

    题目 描述 题目大意 给你平面直角坐标系上的nnn个起点和nnn个终点,(x,y)(x,y)(x,y)每次只能走到(x,y+x)(x+y,y)(x,y−x)(x−y,y)(x,y+x)(x+y,y)( ...

  4. 【JZOJ3423】Vani和Cl2捉迷藏&【BZOJ1143】祭祀river

    description vani和cl2在一片树林里捉迷藏-- 这片树林里有N座房子,M条有向道路,组成了一张有向无环图. 树林里的树非常茂密,足以遮挡视线,但是沿着道路望去,却是视野开阔.如果从房子 ...

  5. Config程序配置文件（configSections）操作实践及代码详注

    所有与配置文件相关的类:(粗体为一般情况下使用到的类,其它类功能可能在很复杂的情况下才使用到.) 1.ConfigurationManager,这个提供用于打开客户端应用程序集的Configurati ...

  6. sqlite3-入门日记4-实现C++类封装

    一.前言:   今天试了下如何用C++类实现接口封装,感觉蛮好 .用于封装的类主要有两个,SQLiteStatement类和SQLiteWrapper类,是一个老外写的.我看了下源码,主要是对C接口进 ...

  7. java浮点运算的陷阱

    首先呢,i你要明白double和float. Inifinity: 例如:syso(5.0/0.0+" 和"+0.0 /0.0); 浮点运算的0.0不是真正意义上的0,而是非常接近 ...

  8. [Ynoi2012]D1T1

    题目 套路的根号分治啊 我们设置一个值\(S\) 对于\(S\leq x\)的操作,我们直接暴力修改,显然这样只会修改\(\frac{n}{S}\)次,所以我们需要一个能够\(O(1)\)修改的数据结 ...

  9. neo4j 实战、实例、示例 创建电影关系图 -1

    1. 创建关系 因为代码占篇幅太大,创建整个"电源关系图"的代码在文章最下方. 2. 简单分析创建语句 2.1 创建电影节点 CREATE (TheMatrix:Movie {ti ...

  10. [Turn]C# 强制关闭当前程序进程（完全Kill掉不留痕迹）

    C#代码 /// <summary> /// 运行DOS命令 /// DOS关闭进程命令(ntsd -c q -p PID )PID为进程的ID /// </summary> ...