使用本地ajax处理json字符串的方法

创建交互式、快速动态网页应用的网页开发技术

Ajax=异步JavaScript和XML(异步JavaScript和XML)。

AJAX不是一种新的编程语言，而是一种使用现有标准的新方式。

AJAX是一种与服务器交换数据并更新一些网页而无需重新加载整个页面的艺术。

什么是json？

JSON的全称是javascript对象符号，它基于JavaScript对象文字。如果只从眼睛看，JSON中的数据都存储在花括号中-{}。如果进一步分析它的用法，JSON是一种数据交换格式。Json以name : value的格式排列，比如下面的json1，是一个json对象。

Var json1={ '姓名' : '李明'，'年龄' :21，'性别' : '男孩' }什么是json字符串？

正如它的字面意思，在json的两边加上双引号(或单引号)。为了避免与内部双引号冲突，我们在外部加上单引号成为json字符串，如下面的json2

Var json2=' { '姓名' : '李明'，'年龄' :21，'性别' : '男孩' }'2。在我们的数据提供页面，输出我们的json，我们仍然称数据提供页面为tigong.php

代码如下：

？phpheader(' content-type : text/html；charset=utf-8 ')；Echo '{姓名' : '黎明'，'年龄' :'12 '，'性别' : '男性' } '；3.接收我们首页的数据，通过eval方法将json字符串解析成json对象，并通过for循环遍历。我们称这一页为testJsonEvel.html

！DOCTYPE html html lang=' en ' head meta charset=' UTF-8 '脚本类型=' text/JavaScript ' window . onload=function(){ var div 1=document . getelementbyid(' div 1 ')；var bt1=document . getelementbyid(' bt1 ')；Bt1.onclick=function(){ //创建ajax对象，写兼容if (window。xmlhttprequest){ var xmlhttp=new xmlhttprequest()；} else { var xmlHttp=new ActiveX object(' Microsoft。XMLHTTP’)；};//获取要发送的数据。在这个例子中，我们没有//设置地址和方法xmlhttp.open ('post '，' tigongson.php ')。//设置我们的请求头信息xmlhttp . setrequest header(' content-type '，' application/x-www-form-URL encoded ')；//bind onreadystatechange事件xmlhttp . onreadystatechange=function(){ if(xmlhttp . readystate==4xmlhttp . status==200){ vardata=xmlhttp . response text；//json字符串转换为json对象数据=eval((“data”))；var str=Str=' name : ' data.name ' brStr=' age : ' data.age ' brstr=' gender : ' data . sex div 1 . innerhtml=str；};};//发送数据xmlhttp . send()；};};/script style type=' text/CSS ' # div 1 { width :200 px；高度：200 px；背景技术# f00color: # fff} img { width:200px}/style title document/title/head body div id=' div 1 ' img src=' http 3360./PHP 2/images/1 . gif '/div brbutton id=' bt1 '单击可获取json数据/button/body/htmlevel，但不存在兼容性问题。

效果如下：

4.使用json.parse方法将json字符串解析为json对象。我们称这一页为testJsonParse.html，代码如下

！DOCTYPE html html lang=' en ' head meta charset=' UTF-8 '脚本类型=' text/JavaScript '窗口。onload=function(){ var div 1=document。getelementbyid(' div 1 ')；var bt1=文档。getelementbyid(' bt1 ')；bt1.onclick=function(){ //创建创建交互式、快速动态网页应用的网页开发技术对象，写兼容如果(窗口. XMLHttpRequest){ var xmlHttp=new XMLHttpRequest()；} else { var xmlHttp=new ActiveX对象(' Microsoft .XMLHTTP’)；};//获取要发送的数据，我们这个例子没有//设置发送数据的地址和方法xmlHttp.open('POST '，' tigongjson。PHP’)；//设置我们的请求头信息xmlhttp。setrequestheader('内容类型'，'应用程序/x-www-form-URL编码')；//绑定onreadystatechange事件xmlhttp。onreadystatechange=function(){ if(xmlhttp。readystate==4 xmlhttp。status==200){ var data=xmlhttp。responsetext//json字符串转换成为json对象data=JSON.parse(数据);var str=str='姓名： "数据。名称“br；str='年龄： "数据。年龄”br；str='性别： '数据。性部门1。innerHTMl=str};};//发送数据xmlhttp。send()；};};/script style type=' text/CSS ' # div 1 { width :200 px；高度：200 px背景技术# f 00 color : # fff } img { width :200 px }/style title文档/title/head body div id=' div 1 ' img src=' http :/php2/images/1.gif' /div br按钮id='bt1 '点击获取json数据/button/body/htmlJSON.parse不存在安全漏洞，但是会有兼容性，IE8及以下不支持。

效果如图

以上所述是小编给大家介绍的使用原生创建交互式、快速动态网页应用的网页开发技术处理json字符串的方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！