<?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. LINUX挂接UNIX系统NFS文件共享

    类似于windows的网络共享,UNIX(Linux)系统也有自己的网络共享,那就是NFS(网络文件系统),下面我们就以SUN Solaris2.8和REDHAT as server 3 为例简单介绍 ...

  2. Luogu P4180 【模板】严格次小生成树[BJWC2010]

    P4180 [模板]严格次小生成树[BJWC2010] 题意 题目描述 小\(C\)最近学了很多最小生成树的算法,\(Prim\)算法.\(Kurskal\)算法.消圈算法等等.正当小\(C\)洋洋得 ...

  3. SoapUI测试接口【转】

    下载安装soapUI工具,具体安装按照提示往下走就可以,这里不着重说明,下面是我打开soapUI工具的起始窗口:  在Projects上鼠标右键点击,选择new soap project(新建一个SO ...

  4. 廖雪峰Java12maven基础-2maven进阶-1使用插件

    1.maven的Lifecycle,Phase和Goal: 使用maven构建项目就是执行Lifecycle 执行Lifecycle就是按顺序执行一系列Phase 每执行一个Phase,都会执行该Ph ...

  5. 洛谷P5104 红包发红包

    题目链接: P5104 题目分析: 题目和\(n\)是没什么关系的,因为是\(n\)个人抢,其实不一定抢完 其实很显然--就是求一个连续型随机变量的期望 首先设一个随机变量\(X\),表示第一个人拿到 ...

  6. 【源码】PyObject_VAR_HEAD 定长对象 变长对象

    PyObject_VAR_HEAD      Python-3.7.4\Include\object.h   /* PyObject_VAR_HEAD defines the initial segm ...

  7. Java-MyBatis-MyBatis3-XML映射文件:缓存

    ylbtech-Java-MyBatis-MyBatis3-XML映射文件:缓存 1.返回顶部 1. 缓存 MyBatis 内置了一个强大的事务性查询缓存机制,它可以非常方便地配置和定制. 为了使它更 ...

  8. FreeMarker 自定义 TemplateDirectiveModel(一)

    FreeMarker 是一个用 Java 语言编写的模板引擎,它基于模板来生成文本输出.FreeMarker 与 Web 容器无关,即在 Web 运行时,它并不知道 Servlet 或 HTTP.它不 ...

  9. adb环境部署及与模拟器的连接

    1.下载adt-bundle-windows-x64安装包,下载网址https://www.7down.com/soft/293453.html 2.对安装包进行解压缩 3.配置环境变量,将adb的路 ...

  10. 795. Number of Subarrays with Bounded Maximum

    数学的方式 是对于所有的字符分成简单的三类 0 小于 L 1 LR 之间 2 大于R 也就是再求 不包含 2 但是包含1 的子数组个数 不包含2的子数组个数好求 对于连续的相邻的n个 非2类数 就有 ...