一)什么是JSON
(1)JSON(Java Script Object Notation(记号,标记))是一种轻量级的数据交换语言,
以文本字符串为基础,且易于让人阅读
注意:XML就是一个重量级的数据交换语言
(2)JSON采用完全独立于任何程序语言的文本格式,使JSON成为理想的数据交换语言
二)JSON的作用
(1)简化创建自定义对象的方式
注意:JSON就是用JS语法来书写,所以必须放在
<code class="hljs javascript has-numbering"><span class="hljs-keyword">var</span> p = { id:<span class="hljs-number">1</span>, name:<span class="hljs-string">"哈哈"</span>, tel:[ { no:<span class="hljs-string">"135"</span>, type:<span class="hljs-string">"中移动"</span> }, { no:<span class="hljs-string">"133"</span>, type:<span class="hljs-string">"中联通"</span> } ], show:<span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">(username)</span>{</span> alert(<span class="hljs-string">"你的姓名是:"</span> + p.name+<span class="hljs-string">":"</span>+username); }, isSingle:<span class="hljs-literal">false</span> }; <span class="hljs-keyword">var</span> p = {<span class="hljs-string">'city'</span>:[<span class="hljs-string">'北京'</span>,<span class="hljs-string">'上海'</span>,<span class="hljs-string">'广州'</span>,<span class="hljs-string">'深圳'</span>]}; <span class="hljs-keyword">for</span>(<span class="hljs-keyword">var</span> i=<span class="hljs-number">0</span>;i<p.city.length;i++){ document.write(p.city[i]+<span class="hljs-string">"<br/>"</span>); }</code>
(2)在AJAX中,作为数据载体之一
注意:JS可以直接解析JSON格式的文本,前提是:该JSON必须采用JS格式书写的才行,如果该JSON是采用Java格式写的,必须使用eval()函数转换后,方可被JS解析,该eval(“”)函数接收一个字符串格式的内容。
(3)省份-城市-区域三级联动【Struts2 + JSON版】
切记:将来JSON是不能完完全全替代XML的,只能在定义对象和数据交换语言方面替代
action:
/**
* 根据省份查询城市
*/
<code class="hljs lasso has-numbering"><span class="hljs-keyword">public</span> <span class="hljs-built_in">String</span> findCityByProvinceMethod() throws Exception{ cityList <span class="hljs-subst">=</span> <span class="hljs-literal">new</span> ArrayList<span class="hljs-subst"><</span><span class="hljs-built_in">String</span><span class="hljs-subst">></span>(); <span class="hljs-keyword">if</span>(<span class="hljs-string">"湖北"</span><span class="hljs-built_in">.</span><span class="hljs-keyword">equals</span>(province)){ cityList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"武汉"</span>); cityList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"黄岗"</span>); }<span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span>(<span class="hljs-string">"湖南"</span><span class="hljs-built_in">.</span><span class="hljs-keyword">equals</span>(province)){ cityList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"岳阳"</span>); cityList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"张家界"</span>); }<span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span>(<span class="hljs-string">"广东"</span><span class="hljs-built_in">.</span><span class="hljs-keyword">equals</span>(province)){ cityList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"韶关"</span>); cityList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"东莞"</span>); } <span class="hljs-keyword">return</span> <span class="hljs-string">"ok"</span>; }</code>
/**
* 根据城市查询区域
*/
<code class="hljs lasso has-numbering"><span class="hljs-keyword">public</span> <span class="hljs-built_in">String</span> findAreaByCityMethod() throws Exception{ areaList <span class="hljs-subst">=</span> <span class="hljs-literal">new</span> ArrayList<span class="hljs-subst"><</span><span class="hljs-built_in">String</span><span class="hljs-subst">></span>(); <span class="hljs-keyword">if</span>(<span class="hljs-string">"武汉"</span><span class="hljs-built_in">.</span><span class="hljs-keyword">equals</span>(city)){ areaList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"AA"</span>); areaList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"BB"</span>); }<span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span>(<span class="hljs-string">"黄岗"</span><span class="hljs-built_in">.</span><span class="hljs-keyword">equals</span>(city)){ areaList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"CC"</span>); areaList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"DD"</span>); }<span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span>(<span class="hljs-string">"岳阳"</span><span class="hljs-built_in">.</span><span class="hljs-keyword">equals</span>(city)){ areaList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"EE"</span>); areaList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"FF"</span>); }<span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span>(<span class="hljs-string">"张家界"</span><span class="hljs-built_in">.</span><span class="hljs-keyword">equals</span>(city)){ areaList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"GG"</span>); areaList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"HH"</span>); }<span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span>(<span class="hljs-string">"韶关"</span><span class="hljs-built_in">.</span><span class="hljs-keyword">equals</span>(city)){ areaList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"II"</span>); areaList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"JJ"</span>); }<span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span>(<span class="hljs-string">"东莞"</span><span class="hljs-built_in">.</span><span class="hljs-keyword">equals</span>(city)){ areaList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"KK"</span>); areaList<span class="hljs-built_in">.</span>add(<span class="hljs-string">"LL"</span>); } <span class="hljs-keyword">return</span> <span class="hljs-string">"ok"</span>; } <span class="hljs-keyword">private</span> <span class="hljs-built_in">List</span><span class="hljs-subst"><</span><span class="hljs-built_in">String</span><span class="hljs-subst">></span> cityList; <span class="hljs-keyword">private</span> <span class="hljs-built_in">List</span><span class="hljs-subst"><</span><span class="hljs-built_in">String</span><span class="hljs-subst">></span> areaList; <span class="hljs-keyword">public</span> <span class="hljs-built_in">List</span><span class="hljs-subst"><</span><span class="hljs-built_in">String</span><span class="hljs-subst">></span> getCityList() { <span class="hljs-keyword">return</span> cityList; } <span class="hljs-keyword">public</span> <span class="hljs-built_in">List</span><span class="hljs-subst"><</span><span class="hljs-built_in">String</span><span class="hljs-subst">></span> getAreaList() { <span class="hljs-keyword">return</span> areaList; }</code>
struts.xml
<code class="hljs xml has-numbering"><span class="hljs-tag"><<span class="hljs-title">package</span> <span class="hljs-attribute">name</span>=<span class="hljs-value">"provinceCityAreaPackage"</span> <span class="hljs-attribute">extends</span>=<span class="hljs-value">"json-default"</span> <span class="hljs-attribute">namespace</span>=<span class="hljs-value">"/"</span>></span> <span class="hljs-tag"><<span class="hljs-title">action</span> <span class="hljs-attribute">name</span>=<span class="hljs-value">"findCityByProvinceRequest"</span> <span class="hljs-attribute">class</span>=<span class="hljs-value">"cn.itcast.javaee.js.provincecityarea.ProvinceCityAreaAction"</span> <span class="hljs-attribute">method</span>=<span class="hljs-value">"findCityByProvinceMethod"</span>></span> <span class="hljs-tag"><<span class="hljs-title">result</span> <span class="hljs-attribute">name</span>=<span class="hljs-value">"ok"</span> <span class="hljs-attribute">type</span>=<span class="hljs-value">"json"</span>></span> <span class="hljs-tag"></<span class="hljs-title">result</span>></span> <span class="hljs-tag"></<span class="hljs-title">action</span>></span> <span class="hljs-tag"></<span class="hljs-title">package</span>></span></code>
<code class="hljs xml has-numbering"><span class="hljs-tag"><<span class="hljs-title">script</span> <span class="hljs-attribute">type</span>=<span class="hljs-value">"text/javascript"</span>></span><span class="javascript"> <span class="hljs-comment">//创建一个Photo对象</span> <span class="hljs-keyword">var</span> p = <span class="hljs-keyword">new</span> Photo(); <span class="hljs-comment">//定位隐藏按钮,同时添加单击事件</span> $(<span class="hljs-string">"#hide"</span>).onclick = <span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">()</span>{</span> <span class="hljs-comment">//调用Photo对象的方法</span> p.hide(); } <span class="hljs-comment">//定位显示按钮,同时添加单击事件</span> $(<span class="hljs-string">"#show"</span>).onclick = <span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">()</span>{</span> <span class="hljs-comment">//调用Photo对象的方法</span> p.show(); } </span><span class="hljs-tag"></<span class="hljs-title">script</span>></span></code>