文档章节

ajax 读取json数据

h
 heiyexue
发布于 2014/06/16 12:46
字数 170
阅读 11
收藏 0
点赞 0
评论 0
  • 首先建立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> 
  • © 著作权归作者所有

    共有 人打赏支持
    h
    粉丝 2
    博文 85
    码字总数 78924
    作品 0
    哈尔滨
    AJAX读取servlet JSON数据·~~

    通过页面访问servlet,页面打印出来的都是json格式的数据。。 AJAX读取数据,开始读取成功了,后来不知道就不行了。。也不知道什么原因,求解答。 读取到sevlet的数据 这个写的AJAX获取数据 ...

    GuGu-Gavin
    2016/12/20
    523
    5
    JQuery中使用$.ajax和$.getJSON方法获取JSON格式数据

    JSON(JavaScript Object Notation)是一种轻量级的数据交换格式。JSONM文件中包含了关于“名称”和“值”的信息。有时候我们需要读取JSON格式的数据文件,在jQuery中可以使用Ajax或者 $.getJ...

    Junn
    2012/11/30
    0
    0
    Ajax + Json 基本用法(自整理)

    Asynchronous javaScipt and Xml 什么是Ajax:异步访问服务器,不刷新页面!不是一项新技术,整合了几项技术组成.主要目的是为了提高用户体验度 执行流程: 在用户界面触发事件调用javaScipt,通...

    SLoan_
    2016/09/06
    7
    0
    前后端数据交互方法总结

    前后端数据交互方法 在此介绍几种常用的前后端数据交互方法,并给出使用建议。以提高前后端协同开发的效率。 目录: HTML赋值 JS赋值 script填充JSON AJAX获取JSON WebSocket实时传输数据 总结...

    303Donatello
    2017/11/21
    0
    0
    jquery的ajax和getJson跨域获取json数据

    很多开发人员在使用jquery在前端和服务器端进行数据交互,所以很容易会认为在前端利用jquery就可以读取任何站点的数据了。近日在进行开发时,因为要和第三方公司的一个项目进行数据的共享,因...

    度外网络
    2012/09/26
    0
    1
    原生javascript实现Ajax和jQuery实现Ajax实例应用

    这是我自己写的例子,希望对大家有帮助 使用了struts2,jdk1.6 1.实体类书写 public class Student { private String toid ; private String name ; private String sex ; public String ge......

    七羽燕
    2014/10/21
    0
    0
    jquery的ajax和getJson跨域获取json数据

    目前浏览器端跨域访问常用的两种方法有两种: 1、通过jQuery的ajax进行跨域,这其实是采用的jsonp的方式来实现的。 jsonp是英文json with padding的缩写。它允许在服务器端生成script tags至...

    sunny5156
    2013/07/25
    0
    1
    Spring MVC RequestBody

    上一节小博老师给大家详细讲解了RequestMapping的具体使用方法以及各个参数的含义。今天小博老师继续给大家讲解RequestBody如何使用。 @RequestBody用于读取Request请求的body数据,并使用H...

    博为峰教研组
    2016/12/06
    36
    0
    JSON进阶第一篇 在PHP与javascript 中使用JSON

    一.JSON简介 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成。JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家...

    晨曦之光
    2012/02/22
    0
    0
    JSON进阶第一篇 在PHP与javascript 中使用JSON

    一.JSON简介 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成。JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家...

    长平狐
    2012/12/10
    53
    0

    没有更多内容

    加载失败,请刷新页面

    加载更多

    下一页

    Ecstore 在没有后台管理界面(维护)的情况如何更新表的字段

    window 系统: 切换到:app\base 目录下: C:\Users\qimh>d: D:\>cd D:\WWW\huaqh\app\base 执行:D:\WWW\huaqh\app\base>cmd update linux 系统: 1># cd /alidata/www.novoeshop.com/app/......

    qimh
    10分钟前
    0
    0
    设计模式-策略模式

    策略模式 解释 对工厂模式的再次封装,使用参数控制上下文信息(将工厂返回的实例赋值给context field) 不会返回bean实例,只是设置对应的条件 调用context的方法(调用field的方法) 用户只...

    郭里奥
    13分钟前
    0
    0
    python使用有序字典

    python自带的collections包中有很多有用的数据结构可供使用,其中有个叫OrderedDict类,它可以在使用的时候记录元素插入顺序,在遍历使用的时候就可以按照原顺序遍历。 a = {"a":1,"b"...

    芝麻糖人
    42分钟前
    0
    0
    RestTemplate HttpMessageConverter

    RestTemplate 微信接口 text/plain HttpMessageConverter

    微小宝
    43分钟前
    0
    0
    mysql视图/存储过程/函数/事件/触发器

    --语法参考:https://dev.mysql.com/doc/ (当前用的是5.6) https://dev.mysql.com/doc/refman/5.6/en/sql-syntax-data-manipulation.html --视图 CREATE VIEW test.v AS SELECT * FROM t;......

    坦途abc
    44分钟前
    0
    0
    MySQL参数优化案例

    环境介绍 硬件配置 cpu核心数 内存大小 磁盘空间 16核 256G 3T 软件环境 操作系统版本 mysql版本 表数目 单表行数 centos-7.4 mysql-5.7.22 128张表 2kw行 优化层级与指导思想 优化层级 MySQ...

    小致dad
    54分钟前
    0
    0
    【HAVENT原创】NodeJS 短网址开发(调用第三方接口)

    最近想弄个短网址的示例站点,在网上搜集了一些代码,都需要数据库支持,所以只能自己写个简单的不需要数据库支持的(PS:那就只能借调第三方的接口了)。 index.js 启动文件 'use strict';...

    HAVENT
    54分钟前
    0
    0
    219. Contains Duplicate II - LeetCode

    Question 219. Contains Duplicate II Solution 题目大意:数组中两个相同元素的坐标之差小于给定的k,返回true,否则返回false 思路:用一个map记录每个数的坐标,如果数相同,如果坐标差小...

    yysue
    今天
    0
    0
    Android 自动生成java bean

    背景: 想搞一个自动生成java bean 的方案。 首先想到的是注解自动生成代码的方法。但是看了看注解相关的东西,发现对已有的类,增加方法,目前没有找到办法。 继续goole :发现了这里。 ht...

    Carlyle_Lee
    今天
    0
    0
    图片加载相关

    本文记载有关于 图片懒加载、图片模糊加载等与图片加载相关的知识,后续会更新 图片懒加载 利用img标签src属性,在该图片快到达客户可视范围时,给img添加src属性(添加后,会发起请求下载图...

    littleFaye
    今天
    0
    0

    没有更多内容

    加载失败,请刷新页面

    加载更多

    下一页

    返回顶部
    顶部