json学习Word格式文档下载.docx

1、xmlns=/www.w3.org/1999/xhtml3. 4. 一段使用eval（）解释会导致页面被重定向的JSON数据5. scripttype=text/javascriptsrc=./jquery-1.7.min.js6. 7. /jquery通过AJAX方式得到JSON数据8. $（document）.ready（function（）9. vardangerJson=message:（function（）window.location=10. /eval（dangerJson）;/会重定向11. jsonArrayJSON.parse（dangerJson）;/会报错-无效字符12

2、. ）;13. 14. 15. 16. /h117. 18. 第二种方法可以防止不安全代码出现通过浏览器原生支持的JSON.parse（str）方法读取JSON数据， 该方法采用解析器验证读入的代码是否真的是JSON代码，这样就提供了较好的安全性。但是，由于这是用模拟的方式读取，速度上会比eval（）慢。四JSON实例下面以一个实例来解释数据是如何被编码成JSON字符串，JSON字符串又是如何在javascript中解析使用的，程序分为json1.php及json1.html。程序还要引用Smarty、JQuery及JSON库文件。1json1.phpphp?php2. /byMoreWind

3、ows（）3. require_once（././smarty_libs/Smarty.class.php）;4. $tpl_article_arrayarray（5. 001=6. titlePHP访问MySql数据库初级篇,7. link8. ）,002中级篇Smarty技术12. 13. 00314. 高级篇AJAX技术15. 16. 17. ）;18. 19. $tpl_article_json$tpl_article_array）;20. $tplnewSmarty（）;21. $tpl-assign（article_array22. $tpl-article_json$tpl_ar

4、ticle_json）;23. $tpl-display（json1.html24. ?2json1.html使用jsonjson2.js7. g_jsonstrJSON.parse（$article_json/通过JSON.parse（）解析JSON字符串$（div）.mouseenter（function（）/mouseentermouseoverthisId$（this）.attr（idjsonidthisId.substring（thisId.lastIndexOf（_+1,thisId.length）;#article_link）.css（position,absoluteleft2

5、0pxtop,$（this）.offset（）.top$（this）.height（）;17. ）.html（链接地址g_jsonstrjsonidlink）;19. ）.slideDown（fast20. $（this）.css（background-colorred21. ）;22. ）.mouseleave（function（）/mouseleavemouseout23. ）.hide（）;24. yellow25. 26. ）;27. 28. styletext/css29. div30. 31. font-family:sans-serif;32. 33. 34. 35. $valu

6、e37. divid=div_$key38. $valuetitle40. /foreach41. spanarticle_linkstyle=display:none;z-index:100/span/p42. 43. 运行结果如下（Win7+IE9.0）：当鼠标经过三个标题时，会触发mouseenter事件显示提示语句。JSON进阶第二篇 AJAX方式传递JSON数据分类：HTML/javascript/PHP2012-01-17 10:142498人阅读评论（4）收藏举报上一篇JSON进阶第一篇 在PHP与javascript 中使用JSON示范了在PHP和javascript中如何使用

7、JSON类型的数据，本篇将介绍用AJAX方式得到JSON数据从而动态生成标题和提示语句。这种技术在静态页面向网站后台请求动态数据时比较有效，因为网站首页的访问量比较大，整个页面要静态化处理，但这个页面上的某些数据又要实时更新，这时就可以在静态页面中使用用AJAX来请求后台实时生成的JSON数据。关于AJAX技术可以参考PHP访问MySql数据库 高级篇 AJAX技术，这里详细介绍如何使用AJAX来传递JSON数据。本示例程序分为json2.php和json2.html， json2.html上有个按钮，按下后将发送AJAX请求得到json2.php返回的数据。1json2.php3. $art

8、icle_array4. count3,20. ）;21. $article_json$article_array）;22. echo$article_json;23. ?2Json2.htmlajax方式请求json7. /显示提示8. functionOnMouseEnterDivInfo（thisObj,title）9. ,$（thisObj）.offset（）.top$（thisObj）.height（）;title）;$（thisObj）.css（16. 17. /隐藏提示18. functionOnMouseLeaveDivInfo（thisObj）19. 22. 23. /jqu

9、ery通过AJAX方式得到JSON数据24. $（document）.ready（function（）#GetDataBtn）.click（function（）26. $.post（json2.php,function（data）27. JSON.parse（data）;28. ileng_jsonstrcount;29. detailhtml;30. for（vari0;ilen;i+）32. divhtmlid=div_onmouseenter=OnMouseEnterDivInfo（this,g_jsonstrionmouseleave=OnMouseLeaveDivInfo（this）

10、;33. +=34. 35. divhtml;36. #detail）.html（detailhtml）;/生成新的标题区域slow40. 41. ）;44. div45. 46. 47. 48. 49. 50. 51. 52. detail53. 54. 55. 56. ServerName localhostDocumentRootD:xampphtdocswww/VirtualHost#虚拟主机 xampphtdocs其中第一个是保证原有的localhost还可以继续工作，第二个为新加域名。然后再修改host文件（在C:WindowsSystem32driversetc）增加：# 注意修

11、改httpd.conf后要重启下apache服务。将JSON进阶第二篇 AJAX方式传递JSON数据文中的json2.php拷贝到D:xampphtdocs目录中再在浏览器中输入网址运行结果如下：在浏览器中能看到如上所示的JSON字符串说明已经成功为apache增加了新的域名，接下来就来体验下JSON的跨域名问题。将json2.html中“$.post（, , function（data）”的“json2.php”改成“用Firefox的Firebug查看点击按钮后AJAX响应的详细过程，可以看到AJAX请求信息已经发送到服务器上了（就是那个127.0.0.1:80），但因为安全性问题，服务器

12、返回的数据被屏蔽了这就是大名鼎鼎的跨域问题。二JSONP解决JSON跨域问题使用JSONP（JSON with Padding）就可以解决JSON的跨域问题，JSONP的原理可以访问http:/zh.wikipedia.org/zh-cn/JSONP，简单的说就是利用了标签拥有的开放策略（相对于同域策略）。下面介绍如何使用JSONP。JSONP的使用分为二步：第一将html文件中的 function（data）改成$.getJSON（第二将json2.php最后的echo$article_json;echo$_REQUESTjsoncallback . （ . $article_json . ）修改这二个地方后就可以解决JSON的跨域问题了。下面也给出完整的示例程序，分为json2.php和json2.html， json2.html上有个按钮，按下后将发送AJAX请求得到json2.php返回的跨域JSON数据。注意和上一篇JSON进阶第二篇 AJAX方式传递JSON数据文中的代码进行比较。1Json2.php8