AJAX-----07XMLHttpRequest对象的处理返回的JSON类型数据
要玩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类型数据的更多相关文章
- AJAX-----06XMLHttpRequest对象的处理返回的XML类型数据
我们首先要确保XML文件是否正常执行 如果访问时候报类似 Parse error: syntax error, unexpected 'version' (T_STRING 这样的错误,我们则需要 ...
- Struts2+Jquery实现ajax并返回json类型数据
来源于:http://my.oschina.net/simpleton/blog/139212 摘要 主要实现步骤如下: 1.JSP页面使用脚本代码执行ajax请求 2.Action中查询出需要返回的 ...
- 转载：Struts2+Jquery实现ajax并返回json类型数据
摘要: 主要实现步骤如下: 1.JSP页面使用脚本代码执行ajax请求 2.Action中查询出需要返回的数据,并转换为json类型模式数据 3.配置struts.xml文件 4.页面脚本接受并处理数 ...
- springMvc 使用ajax上传文件，返回获取的文件数据 附Struts2文件上传
总结一下 springMvc使用ajax文件上传 首先说明一下,以下代码所解决的问题 :前端通过input file 标签获取文件,通过ajax与后端交互,后端获取文件,读取excel文件内容,返回e ...
- javascript解析从服务器返回的json格式数据
在javascript中我们可以将服务器返回的json格式数据转换成json格式进行使用,如下: 1.服务器返回的json格式数据: 通过response.responseText获得: " ...
- json进阶(一)js读取解析JSON类型数据
js读取解析JSON类型数据 一.什么是JSON? JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式,同 ...
- C#操作json类型数据
将对象序列化为 JavaScript 对象表示法 (JSON),并将 JSON 数据反序列化为对象. 此类不能继承. // msdn 例子: namespace SL_DataContractJson ...
- MySQL JSON 类型数据操作
1.Java 中动态扩展字段,会导致数据库表被锁,在MySQL 5.7.8版本之前,因为MySQL不能直接操作JSON类型数据,可以将一个字段设定成varchar类型,里面存放JSON格式数据,这样在 ...
- js读取解析JSON类型数据【申明：来源于网络】
js读取解析JSON类型数据[申明:来源于网络] 地址:http://blog.csdn.net/sunhuaqiang1/article/details/47026841
随机推荐
- 在IE8中使用padding设置select控件文字垂直居中
在火狐.苹果.谷歌.欧鹏等主流浏览器中,select下拉表单的文字能够垂直居中,如图: 而在ie8中,select下拉表单的文字基本就是靠底部显示,如图: 那么,如何使得ie8下的select文字垂直 ...
- 3ds Max Shortcuts 快捷键大全
主界面 [Q]选择循环改变方式 [W]移动 [E]旋转 [R]缩放循环改变方式 [7]物体面数 [8]Environment [9]Advanced lighting [0]Render to Tex ...
- hadoop Error: JAVA_HOME is not set and could not be found.
Hadoop安装完后,启动时报Error: JAVA_HOME is not set and could not be found.解决办法: 修改/etc/hadoop/hadoop- ...
- 禁止浏览器直接访问php文件
框架中很多php文件并不是用来如果熟悉框架的路径就能直接访问这个文件,虽然访问到了也不能看到什么(他看到的是编译过后的html文件),但还是觉的很不安全. 可以通过下面这种方法拒绝他人的从浏览器中的访 ...
- Android课程---Activity 的生命周期
activity类处于android.app包中,继承体系如下: 1.java.lang.Object 2.android.content.Context 3.android.app.Applicat ...
- vue 解决display与 transition冲突
下边是vue的源码 var raf = inBrowser && window.requestAnimationFrame; var waitForTransitionStart = ...
- 使用LVM对硬盘在线扩容
初始状态: root@control:/dev/nova-volumes# vgdisplay --- Volume group --- VG Name nova-volumes System ID ...
- 【iCore3 双核心板】例程十二：通用定时器实验——定时点亮LED
实验指导书及代码包下载: http://pan.baidu.com/s/1kTWAAJ9 iCore3 购买链接: https://item.taobao.com/item.htm?id=524229 ...
- git总是出现untracked content怎么解决？
git rm --cached vendor/plugins/open_flash_chart_2 rm -rf vendor/plugins/open_flash_chart_2/.git # BA ...
- php预定义变量，超全局变量，魔术方法，特殊函数变量使用
<?php /* * 本代码全部为测试函数代码,部分注释和写实例 * * 修改php.ini variables_order=”EGPCS” * 请注意$_REQUEST在优先级传参的时候会造成 ...